vue.js 中的computed属性怎么用

利用vuex实现状态管理,初始化给table的data属性赋值[],页面数据table中的数据是通过comouted来获取data的,在发送请求后获取数据,首先将data重新初始化为[], 然后改变state中data的值为响应数据中的值,为什么页面不会展示data中的数据,利用vue-devtools看到data仍然是[],这是怎么回事?
代码1:INITSQLINFO:(state,uid)=>{

    state[uid].data = [];
},

store中的初始化
代码2:computed:{

    execSQLInfo(){
                    return this.getTabData.data;
                }

}
代码三:
this._initExecSQLInfo(this.uid); 先重新初始化
this.execSQLInfo.push(_resObj); 改变data中的数据;

_initExecSQLInfo 就是调用初始化1中的代码;
execSQLInfo是调用mutation中的函数:ADD_SQL_INFO:(state,uid,resObj)=>{

    state[uid].data.push(resObj);
}
阅读 13.6k
3 个回答

终于明白vue.js在这一块是怎么玩的啦:受 ES5 的限制,Vue.js 不能检测到对象属性的添加或删除。因为 Vue.js 在初始化实例时将属性转为 getter/setter,所以属性必须在 data 对象上才能让 Vue.js 转换它,才能让它是响应的。

建议看一下官网最基本的 computed 的例子先

不用 Computed:

<div>
  <div v-show="a && (b && (c === 'user' && (d ? e(data) : true)))"></div>
</div>

用 Computed:

<div>
  <div v-show="show"></div>
</div>
  export default {
    computed: {
      show () {
        // 这里还能做更多事情.
        return a && (b && (c === 'user' && (d ? e(data) : true)))
      }
    }
  }
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题