Vue.js
plandast
这个作者很懒,什么都没留下…
展开
-
深入理解.sync修饰符
什么时候可以用sync修饰符看下面一个案例:爸爸通过props向子组件传一个外部数据,告诉他自己有多少钱total。当儿子要花钱的时候,注意不能直接在子组件里进行修改,因为这是外部数据。正确做法应该是通知父亲,让父亲给钱,而不能自己把数据修改了。于是子组件通过这段代码<button @click="$emit('update:money', money-100)">触发一个花钱事件,通知父亲需要多少钱。同时,父组件应该监听这个事件,<Child :money="total" v原创 2022-01-14 15:09:29 · 360 阅读 · 0 评论 -
computed 和 watch 的区别
computedcomputed 就是计算属性的意思,是用来计算出一个值的。调用时不需要加括号,可以当属性来用。根据依赖自动缓存,依赖不变就不会重新计算。watchwatch 就是监听的意思。它会在观察到某个属性的变化时候执行一个函数。两个选项:immediate 是否在第一次渲染的时候(从无到有)执行这个函数。deep 如果监听一个对象,对象里面嵌套的东西变化是否算对象本身的变化。总结如果一个数据依赖于其它数据,那么一般把这个数据设置为 computed。如果需要在某个数据原创 2022-01-13 21:31:55 · 144 阅读 · 0 评论 -
Vue 数据响应式
数据响应式是什么用一段简单的代码理解 Vue 的数据响应式:const vm = new Vue({ data: { n: 0 }, template: '<div>{{ n }}</div>'})setTimeout(()=>{ vm.n += 10 // 修改 vm.n,UI 中的 n 会随着改变},3000)一句话概括,即:当你修改 Vue 中的数据模型时,视图会自动进行更新。原理const vm = new Vue({da原创 2022-01-13 17:47:17 · 301 阅读 · 0 评论