vue一些注意事项

  • Z时代
  • 2024-01-10
  • 分类：综合

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 >
  <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一些注意事项 的全部内容， 来源链接： utcz.com/z/378648.html

回到顶部