vue组件方法通过变量改变数据

Question

我想更改数组数据，在vue方法中更改。

https://codepen.io/deded007/project/editor/AQyykN

我的问题是如何使用这样的变量来更改数据

created() {
  var a=this.thisisarray;
  this.thisisarray=[10];
  console.log('a expected '+this.thisisarray+',but '+ a);
}

直接使用this.thisisarray 没问题。但是更改变量a 不起作用。我的变量仍在查看旧参考。我总是得到a expected 10,but 9999 我想创建一个全局方法并传递我的变量a 来更改它。

Vue.component('page-head', {
  template: '#page-head',
  data() {
    return {
      thisisarray:['a','b']
    };
  },
  created() {

      var a=this.thisisarray;
      this.thisisarray=[10];
      console.log('a expected '+this.thisisarray+',but '+ a);
  }
})

Answer 1

数字被复制。 t 独立于 tom 一旦被复制。

这不是 vue 的东西，这就是 javascript 的工作原理。您对引用类型感到困惑。如果你有的话在哪里

{
   tom: { value: 9999 }
}

然后做了

var t = this.tom;
this.tom.value = 10
console.log('t expected '+this.tom.value +',but '+ t.value);

你会得到你所期望的

现在您已经更改了代码：

您现在正在为您的数据分配一个新引用，但您的变量仍在查看旧引用。如果你不分配一个新数组，而只是改变它的内容，你会得到你所期望的。

更多解释搜索原始类型和引用类型，例如https://docstore.mik.ua/orelly/webprog/jscript/ch04_04.htm