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的内置 ...
随机推荐
- thinkphp3.2.3 自动验证 unique 出错的解决办法
场景:修改数据时,唯一验证name字段出错,提示已存在. 排查: 1.传入的参数是否包含主键,因为 D('模型名')->create() 会自动判断是否是新增或者修改,根据传入的参数判断是否包含 ...
- JS通过sort(),和reverse()正序和倒序
sort()正序 var array1 = [0,1,5,10,15]; array1.sort();//结果为:0,1,10,15,5 请注意,上面的代码没有按照数值的大小对数字进行排序,要 ...
- 外星人电脑出现the system is running in low graphics mode的解决方法
问题现象: 执行删除GCC5.4.0: sudo apt-get remove gcc gcc-5重启电脑后,就显示the system is running in low graphics mod ...
- 标准模板库(STL)
组件: 容器:管理某类对象的集合. 迭代器:用来在一个对象集合内遍历元素. 算法:处理集合内的元素. 容器 序列式容器:顾名思义.array,vector,deque,list 和 forward_l ...
- 架构师成长之路5.1-Saltstack安装及入门
点击架构师成长之路 架构师成长之路5.1-Saltstack安装及入门 (安装.配置.启动) 配置管理工具: Pupper:1. 采用ruby编程语言:2. 安装环境相对较复杂:3.不支持远程执行,需 ...
- Charles中使用Rewrite提高测试效率
上次给大家演示了Charles中通过Map Local功能来提高测试效率,Charles还有另外一个强大的功能,Rewrite,这次也给大家演示一下. Charles中的Rewrite功能非常强大,可 ...
- SEO黑页以及门页框架和JS跳转实现方法
在去年大家还在针对第三方博客狂轰乱炸,比如:webs.com.blogspot.com.weebly.com主要是因为本身博客平台的权重,再就是低廉的成本,主需要注册,没有域名和服务器的投入.排名也非 ...
- springboot rabbitmq direct exchange和topic exchange 写法上关于路由键的区别
这是direct exchange写法中消息发送写法,可见下图红色框中路由键是queue队列中定义的路由键 这是topic exchange写法中消息发送写法,可见下图红色框中路由键是exchange ...
- Windows 和 Linux 下生成以当前时间命名的文件
在 Windows.Linux 操作系统,分别利用BAT批处理文件和Shell脚本,生成类似“20110228_082905.txt”以“年月日_时分秒”命名的文件. Windows BAT批处理文件 ...
- DveOps路线指南
学习DevOps所需的技能 1. 编程语言 python java javascrit 2. 学习不同的操作系统概念 进程管理,线程和兵法,套接字,I/O管理,虚拟化,内存储存储和文件系统. 3. ...