this.$data和this.$options.data()区

2022-05-23  本文已影响0人  乐宝呗

1、个人的理解

this.$data是已经转成了getter和setter,所以拿到的是一个修改后的数据

this.$options.data()是刚刚传入vue里边,成员没有转成了getter和setter,所以拿到的仅仅是注入vue实例的初始数据

2、监听路由-初始化data

在监听属性里边,监听$route就可以每次刷新 重新 初始化。然后element-ui的表单重置好像也和这个差不多

$route() {

    Object.assign(this.$data, this.$options.data());

   // 把初始化的数据覆盖到已经修改了的数据上,通过浅拷贝Object.assign实现。

    const mounted = this.$options.mounted || [];

   //  this.$options.mounted这里拿到的是一个数组,里边存的是mounted这个钩子函数

    mounted.forEach(fn => fn.call(this));

   // 执行一次mounted钩子,并传入当前的this

},

总的代码意思就是说:当监听到路由变化的时候,让数据重置,然后再执行mouted钩子函数,把数据再出现渲染

上一篇 下一篇

猜你喜欢

热点阅读