在以下代码中,我尝试使用 getTranslation
对象来映射 originalKeys
数组中存在的值,并将值推送到新数组 allKeys
中。
但是 ESLint 给了我这个错误, Unexpected side effect in "getkeys" computed property.
我尝试将 getkeys 函数转换为方法,但我认为每次都调用一个方法来完成翻译是没有意义的。我该如何解决这个问题?
<template>
<select v-model="selected">
<option v-for="key in getkeys" v-bind:key="key"> {{ key }}</option
</select>
</template>
data(){
return{
selected: '',
allKeys: [],
originalKeys: [], //e.g. ["ALPHA_MIKE]
getTranslation: {} //e.g. {"ALPHA_MIKE": "ALPHA MIKE"}
}
},
computed: {
getkeys(){
let tableHeaders = [];
for( var i=0; i<this.originalKeys.length; i++){
let translation = this.getTranslation[this.originalKeys[i]];
tableHeaders.push(translation);
}
this.selected = tableHeaders[0]; //unexpected side effect here
this.allKeys = tableHeaders; //unexpected side effect here.
return this.allKeys;
}
}
原文由 Vasu Mistry 发布,翻译遵循 CC BY-SA 4.0 许可协议
正如我上面的评论,你不应该编辑
computed
属性中的其他数据,你应该使用watch
代替