Question

我希望使用变量动态访问属性。

例如，我有：

data(){
    redsection : '',
    bluesection : '',
},
methods(){
     changeColor(color, val){
          this.{color+"section"} = val;
     }
}

我正在尝试做的事情在视图中有一个功能：

<button @click="changeColor("blue", "bar")>blue</button>
<button @click="changeColor("red", "bar")>blue</button>

Answer 1

使用索引器。

this[color+"section"] = val;

这是example。

Answer 2

如果你想让它变得更漂亮，你也可以稍微改变一下，如下所示：

data(){
     section: {
          red : 'red',
          blue : 'blue'
     }
},
methods(){
     changeColor(color, val){
          this.section[color] = val;
     }
}

VueJS - 将变量传递给此。{variable}

2 个答案: