Javascript Vue.js存在访问动态生成（基于Vuex数据）表单元格属性的问题

在添加提示头之后

单击以更改表格模式并等待2秒钟

我看到了不同的意外结果：

为了使用异步计算属性模拟延迟（类似于从Vuex或AJAX请求接收数据），我使用sleepForDebug（）函数：

sleepForDebug(delay) {
  var start = new Date().getTime();
  while (new Date().getTime() < start + delay);
}

Vue.config.productionTip=false；
Vue.config.devtools=false；
新Vue({
el:“应用程序”，
数据：{
longMode:false，
栏目：7，
任务：[]
},
创建（）{
this.tasks=this.newTasks；
},
观察：{
新任务（任务）{
这个。任务=任务；
这是.$forceUpdate（）；
}
},
计算：{
newTasks（）{
让tasks=null；
如果（此.longMode）{
任务=[
{开始：0，结束：3}，
{开始：2，结束：5}，
{开始：1，结束：7}
];
}否则{
任务=[
{开始：0，结束：4}，
{开始：2，结束：6}
];
}
这是sleepForDebug（2000年）；
返回任务；
/*
这个。延迟（2000）。然后（（）=>{
log（“返回新任务：”）；
console.log（任务）；
返回任务；
})
*/
}
},
方法：{
切换（）{
this.longMode=！this.longMode；
this.columns=this.longMode？14:7；
this.tasks=this.newTasks；
//log（“单击！longMode:+this.longMode”）；
},
sleepForDebug（延迟）{
var start=new Date（）.getTime（）；
while（new Date（）.getTime（）0）{
//console.log（this.newTasks）；
让task=this.newTasks[rowIndex]；
如果（任务）{
//日志（“任务：”）；
//console.log（任务）；
//让start=task.start；//关于问题1：“第一次不触发”-第一次何时？渲染后，单击第一个按钮？请澄清。关于问题2：什么是未定义的？
startRef
或
此。$refs[startRef]
或
此。$refs[startRef][0]
？你好，MarcRo.1.现在我了解了：this.tasks=this.newTasks；-那一刻没有新的值。2.如果要更改代码：and:：style=“getLineStyle（rowNumber）”-rowNumber未定义下一个想法是-该表的行数将与newTask.length的值相同，并且每行应表示每行上任务的开始日期和结束日期（每行都是任务）。我需要获取一个rowNumber，并根据该数字获取每行上的行属性。
watch: {
  newTasks(tasks) {
    console.log("watch: newTasks()-------------");
    console.log(tasks);
    this.tasks = tasks;
    this.$forceUpdate();
  }
},