Vue.js知识点杂记

59次阅读

共计 894 个字符,预计需要花费 3 分钟才能阅读完成。

渲染
深入式响应 – 页面监听对象或数组型的数据变化,简单的设置某个元素的的值是无效的,要使用 push 等变异方法,或者使用 vue.$set()
nextTick–DOM 发生变化后会执行写入的回调函数
父子组件传值
子传给父 –this.$emit() 触发事件,传递数据
父传给子 – 如果是一个对象的话,在父组件的 data 里要把对象的属性都要声明出来,不然在子组件是渲染不出来的,同时属性要初始化
prop 值修改问题 – 不要轻易修改组件中 prop 的值(它是用来父组件传值给子组件,随意修改会影响其在父组件里的数据混乱)对于引入类型的数据如数组和对象来说,它们的值则是数据的地址。这是要区分开来的。
对 prop 进行“双向绑定”– 在一个包含 prop 的子组件中,用 this.$emit(‘update:title’, newTitle) 来表达对其赋新值的意图。然后在父组件中可以监听那个事件并更新一个本地的数据属性 <text-document v-bind:title.sync=”doc.title”></text-document>
路由
路由前置守卫 – 想要结束路由守卫,整段代码的逻辑必须有 next() 进行结尾。
this.$route– 定位到了当前路由的对象,可以获取到 query、params、name、path 等信息 this$router 为 VueRouter 实例,通过 push、replace 等函数实现了路由的跳转
watch 监听
watch 失效问题 – 监听对象,要加一个配置 deep: true 因为对象的值是一个引用,我们改变对象属性的值的时候,改变的不是这个对象的引用,因此监听不到
watch 中 oldVal 对于深度监听对象是无效的,其实对于 oldValue 的值和 newValue 的值等同这种现象是合理的,因为都指向了同一个引用,值当然是一样的
其他
混入 – 分发 vue 组件中可复用的功能,混入组件的意思是,其他组件可以使用被混入组件的计算属性
template– 语义化标签,把它当做不可见的包裹元素,最后不会渲染出来,一般用于插槽,v-if 渲染和 v -for 渲染
在 computed 的方法内如传递参数 – 使用闭包

正文完
 0