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的内置 ...
随机推荐
- Object 对象(对象的分类、属性(属性名和属性值)、基本数据类型与引用数据类型区别)
Object——引用数据类型 基本数据类型的不足之处:基本数据类型是单一的值,不能表现出值与值之间的所属关系 object分为内建对象.宿主对象和自定义对象 a 内建对象:ES标准中定义的对象,在任何 ...
- HTTP/HTTPS协议 & GraphQL(非RESTFUL方式)
HTTP访问控制-跨域资源共享(CORS) 缓存管理 HTTP VS HTTPS架构 TLS协议 HTTPS会话劫持 基于HTTP协议的服务器消息机制 1. Longpoll 2. SSE 3. We ...
- Java定义栈结构,实现入栈、出栈操作
package com.example.demo; import java.util.ArrayList; public class Stack { ArrayList<Object> l ...
- Mysql检查列是否存在并新增、修改、删除列
在MYSQL中,新增.修改.删除列时不能进行IF EXISTS判断,IF语句只能出现在存储过程当中,故博主用存储过程的方法新增.修改.删除列,修改列名称. DROP PROCEDURE IF EXIS ...
- KVM和Docker的对比
虚拟化技术对比: KVM:全虚拟化,需要模拟各种硬件 docker:严格来说不算是虚拟化技术,只是进程隔离和资源限制 实例启动进程对比: 在kvm虚拟机中执行top命令,看宿主机进程树,根本看不到to ...
- 解决Redis中文乱码问题
启动客户端的时候添加 --raw 选项即可 wangyulong@code-local:~$ redis-cli 127.0.0.1:6379> set key1 '上海' OK 127.0.0 ...
- deepin下挂载的的Windows系统(NTFC)目录怎么是只读的???
关键命令: df-h sudo ntfsfix /dev/sda4 重启 参考博客:深度官网问题之大神回复
- Oracle批量导出表数据到CSV文件
需求:把oracle数据库中符合条件的n多表,导出成csv文本文件,并以表名.csv为文件名存放. 实现:通过存储过程中utl_file函数来实现.导出的csv文件放入提前创建好的directory中 ...
- Office365 PowerShell打开邮箱审计功能
最近总公司要求Office365需要在所有的邮箱上面打开审计功能.这个功能没法通过图形界面操作,只能通过powershell脚本实现. 微软提供了一个官方的脚本,不过里面有个小bug https:// ...
- CI/CD----jenkins+gitlab+django(内网)
1.py第三方包获取 ./pip3 ./pip3 -i "http://pypi.douban.com/simple/" --trusted-host pypi.douban.co ...