vue一些注意事项
1.生命周期钩子的 this 上下文指向调用它的 Vue 实例。
不要在选项属性或回调上使用箭头函数,比如 created: () => console.log(this.a) 或 vm.$watch('a', newValue => this.myMethod())。
因为箭头函数是和父级上下文绑定在一起的,this 不会是如你所预期的 Vue 实例,经常导致
Uncaught TypeError: Cannot read property of undefined 或 Uncaught TypeError: this.myMethod is not a function 之类的错误。2.
2.数据绑定最常见的形式就是使用“Mustache”语法 (双大括号) 的文本插值
3.如果你知道你会在晚些时候需要一个属性,但是一开始它为空或不存在,那么你仅需要设置一些初始值。
4.Object.freeze(),这会阻止修改现有的属性,也意味着响应系统无法再追踪变化(https://cn.vuejs.org/v2/guide/instance.html)。
var obj = {
foo: 'bar'
}
Object.freeze(obj)
new Vue({
el: '#app',
data: obj
})
<div id="app">
<p>{{ foo }}</p>
<!-- 这里的 `foo` 不会更新! -->
<button @click="foo = 'baz'">Change it</button>
</div>
5.Vue 实例还暴露了一些有用的实例属性与方法。它们都有前缀 $,以便与用户定义的属性区分开来。例如:
var data = { a: 1 }
var vm = new Vue({
el: '#example',
data: data
})
vm.$data === data // => true
vm.$el === document.getElementById('example') // => true
// $watch 是一个实例方法
vm.$watch('a', function (newValue, oldValue) {
// 这个回调将在 `vm.a` 改变后调用
})
6.
vue一些注意事项的更多相关文章
- vue项目注意事项
vue项目注意事项 1. 文件和路由命名规范 views里面代表的是你下面导航中的每一块,每个文件名 需要大写,路由命名全部小写,第一层路由就是最下面的那几个导航的名字,二级路由是在一 级路由的基础上 ...
- vue 学习注意事项
一:插值方式: 1:数据绑定,最常见的形式就是使用 “Mustache” 语法(双大括号)的文本插值 <span>Message: {{ msg }}</span> 通过使用 ...
- Vue.component注意事项
Vue.component前不要加 new,否则报错: Uncaught TypeError: Cannot read property '_base' of undefined
- Vue路由注意事项
一.vue中路由的使用 1.定义组件 <template> <div class="hello"> <h1 @click="info&quo ...
- vue todolist待办事项完整
<template> <div id="app"> <input type="text" v-model='todo' @keyd ...
- Vue自定义过滤器
gitHub地址: https://github.com/lily1010/vue_learn/tree/master/lesson05 一 自定义过滤器(注册在Vue全局) 注意事项: (1)全局方 ...
- vue.js学习 自定义过滤器使用(2)
gitHub地址: https://github.com/lily1010/vue_learn/tree/master/lesson05 一 自定义过滤器(注册在Vue全局) 注意事项: (1)全局方 ...
- 不一样的Vue实战3:布局与组件
不一样的Vue实战3:布局与组件 发表于 2017-06-05 | 分类于 web前端| | 阅读次数 11534 http://yangyi1024.com/2017/06/05/%E4%B ...
- vue-keep-alive
查看github源代码 https://github.com/Diamondjcx/vue-test Vue keep-alive实践总结 <keep-alive>是Vue的内置 ...
随机推荐
- 剑指offer-左旋转字符串-知识迁移能力-python
题目描述汇编语言中有一种移位指令叫做循环左移(ROL),现在有个简单的任务,就是用字符串模拟这个指令的运算结果.对于一个给定的字符序列S,请你把其循环左移K位后的序列输出.例如,字符序列S=”abcX ...
- 04 Python之while循环/格式化输出/运算符/编码
1. while循环 while 条件: 循环体(break,continue) else: 循环体(break,continue) break:彻底干掉一个循环,直接跳出. continue:停止当 ...
- this —— javascript
目录 为什么要讨论this this是什么 如何改变this的指向 箭头函数中的this 为什么要讨论this 代码一: function fun1(){ var aa = 'I am aa'; co ...
- angular项目中ts的配置编译tsconfig.json
{ "compilerOptions": { /* 基本选项 */ "target": "es5", // 指定 ECMAScript 目标 ...
- 第十三篇 JS 操作table表格
JS 操作table表格 这节课难度可能高一点,因为没有提前解释if判断.for循环.这节课是直接把这两样用上了,老师先简单介绍一下: if,判断语句,判断就很简单了嘛,假如说1=1(1等于1),当然 ...
- 3.(基础)tornado的接口调用顺序与模板
上一节介绍了tornado的请求与响应,这一节介绍tornado的接口调用顺序和模板 首先都有哪些接口呢?作用是什么呢?并且都有的时候,执行顺序是怎么样的呢? 接口 1.initialize,表示初始 ...
- lightinthebox头部分类菜单下拉导航,使鼠标移到See All Categories就显示下拉菜单
lightinthebox头部分类菜单下拉导航,使鼠标移到See All Categories就显示下拉菜单 打开includes\templates\lightinthebox\common\tpl ...
- Java事务(转载)
Java事务的类型有三种:JDBC事务.JTA(Java Transaction API)事务.容器事务. 1.JDBC事务 JDBC 事务是用 Connection 对象控制的.JDBC Conne ...
- JavaScript中数组元素删除的七大方法汇总
原文链接:https://blog.csdn.net/u010323023/article/details/52700770 在JavaScript中,除了Object之外,Array类型恐怕就是最常 ...
- Linux 性能优化笔记:软中断(转载)
进程的不可中断状态是系统的一种保护机制,可以保证硬件的交互过程不被意外打断. 所以,短时间的不可中断状态是很正常的. 但是,当进程长时间都处于不可中断状态时,你就得当心了.这时,你可以使用 dstat ...