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的内置 ...
随机推荐
- ado.net SqlHelp类
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...
- Ubuntu 18.04 LTS 64位Linux搭建Kubernetes 1.15.3并join子节点的完整过程
1.软件准备 1.1.Ubuntu系统安装 https://ubuntu.com/download#download ubuntu系统需要设置用户,root默认为系统的账户不能被用户设置且每一次开机都 ...
- VMWare中CentOS7 设置固定IP且能够访问外网
最近搭建kubernetes集群环境时遇到一个问题,CentOS7在重启后IP发生变化导致集群中etcd服务无法启动后集群环境变得不可用,针对这种情况,必须要对CentOS7设置固定IP且可以访问外网 ...
- springboot中使用servlet时返回结果乱码问题
在总的配置文件:application.properties中做一个配置,把我的问题解决了. #编码格式 spring.http.encoding.force=true spring.http.enc ...
- 01-spring框架——spring概述
Spring 是于 2003 年兴起的一个轻量级的 Java 开发框架,它是为了解决企业应用开发的复杂性而创建的.Spring 的核心是控制反转(IoC)和面向切面编程(AOP).Spring 是可以 ...
- 在vue移动端使用lib-flexible和px2remLoader适配屏幕
在对移动端的适配过程中,之前一直用的rem来进行,通过自己封装一个rem的计算函数来对整个项目进行适配.现在发现了一种更为简单,也更加方便的方式来对移动端进行屏幕的适配. 下载lib-flexible ...
- 程序包管理工具yum
yum 首先要有一个网络上或本地或远程的yum仓库.然后需要yum安装程序的机器去yum仓库下载yum元数据(包括包信息和依赖信息)到本地的cache里.当需要安装程序的时候,会查看yum源数据里是否 ...
- CAP 与 注册中心
https://blog.csdn.net/fly910905/article/details/100023415 http://www.ruanyifeng.com/blog/2018/07/cap ...
- 更新protobuf
sudo pip install --upgrade protobuf sudo apt-get install libprotobuf-dev protobuf-compiler这个不知道是什么问题 ...
- 2017 趋势科技 研发4.26(offer)
南京趋势科技外企(offer) 笔试 在华科线下笔试的,推荐多参加线下笔试,因为相对难度会低一些,好进一些. 当时笔试的估计只有60几个,然后选择题感觉有的不会,编程简单. 第二天去面试的时候,hr小 ...