为什么Vue.js中的watch方法在道具未更改时被触发?

为什么Vue.js中的watch方法在道具未更改时被触发?,vue.js,Vue.js,我了解,当更改/重新分配正在监视的属性/数据时,会触发该属性/数据的监视方法 然而,在这段代码片段中,initTasks的watch方法被触发,尽管initTasks没有被更改/触摸(或者看起来是这样) 此代码段应该在每次添加任务时增加“估计值”。但是,估计值不会增加,因为每次估计值都会被initTask的watch方法覆盖 Vue.component('customcomponent'{ 道具:['initTasks','initEstimate'], 数据(){ 返回{ 任务:[], 估

我了解,当更改/重新分配正在监视的属性/数据时,会触发该属性/数据的监视方法

然而,在这段代码片段中,initTasks的watch方法被触发,尽管initTasks没有被更改/触摸(或者看起来是这样)

此代码段应该在每次添加任务时增加“估计值”。但是,估计值不会增加,因为每次估计值都会被initTask的watch方法覆盖

Vue.component('customcomponent'{
道具:['initTasks','initEstimate'],
数据(){
返回{
任务:[],
估计:0,
}
},
模板:`
  • {{task.text}
你需要{{估计}个小时才能完成所有这些

添加任务 `, 方法:{ 初始化(){ this.tasks=this.initTasks; this.estimate=this.initEstimate; }, addTask(){ Vue.set(this.tasks,this.tasks.length{ 文本:“执行此新任务” }); 这个.估计++; } }, 观察:{ initTasks:函数(oldval、newval){ log('watchforinittasks触发器!'); 这是初始化(); } }, 安装的(){ console.log('mounted()已触发!') 这是初始化(); }, 创建(){ console.log('created()triggered!') }, 更新的(){ console.log('updated()triggered!') }, 销毁(){ console.log('updated()triggered!') } }); 新Vue({ el:“应用程序”, 数据:{ 任务:[ {text:“学习JavaScript”}, {文本:“学习Vue”}, {text:“在JSFiddle中玩”}, {文本:“构建一些很棒的东西”} ], 估计数:5 } });
如果将初始化方法更改为:

    initialize() {
      this.tasks = this.initTasks.slice();
      this.estimate = this.initEstimate;
    }
一切都会好起来的。我认为监视程序被触发是因为当您更改任务数组时,initTasks也会被更改,因为数组是

如果您正在使用es2015及更高版本,您可以:

this.tasks=…[this.initTasks]

this.tasks=Array.from(this.initTasks)