Question

我希望根据其他一些变量计算一些data变量，并在Vue实例中跟踪它们的变化。天然的解决方案

＆＃13;

new Vue({
  el: '#root',
  data: {
    a: 1,
    b: a + 1
  }
})

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.0.3/vue.js"></script>

<div id="root">
  {{ a }} and {{ b }}
</div>

＆＃13;

以Uncaught ReferenceError: a is not defined失败。

是否可以使用以前定义的变量动态创建新变量？

Answer 1

解决方案是使用computed values，b的访问方式与在data中声明的方式相同：

＆＃13;

new Vue({
  el: '#root',
  data: {
    a: 1
  },
  computed: {
    // a computed getter
    b: function() {
      // `this` points to the vm instance
      return this.a + 1
    }
  }
})

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.0.3/vue.js"></script>

<div id="root">
  {{ a }} and {{ b }}
</div>

＆＃13;

Answer 2

试试这个

var x;
new Vue(x = {
   el: '#root',
   data: {
     a: 1,
     b: () =>  x.data.a + 1
   }
})

可以根据其他数据计算数据中的变量吗？

2 个答案: