我有一个遍历数组/对象的计算属性。该属性贯穿用户输入以查找我设置的字符数限制,然后绑定警告类。该数组包含两个级别:嵌套在主数组中的第一层数组代表用户在上一步中输入的关键字。然后,在该数组中,存在用于该关键字的特定操作的对象。因此,“活动”输入字段对应于特定的关键字(“对象数组”)。
第一次运行时效果很好,但是当我更改active关键字时,某些内容将变为“未定义”。这是与此操作相关的代码。
注意** this.options只是一个数组:[k1,k2,k3] this.newAd是一个嵌套有包含对象的数组的数组。
<div class="control">
<div id="newAd-Preview" class="select">
<select v-model="activeKeyword" @change.once="restOfAds()" @change="hideInput2()">
<option v-for="option in options">
{{option}}
</option>
</select>
</div>
</div>
<div class="field">
<div class="control is-expanded">
<input type="text" class="input size19" :class="{'is-danger' : charCheck[keywordIndex].includes('path2')}" v-model="key.path2" placeholder="path2"
</div>
</div>
data:{
newAds: [
[{
h1: '',
path2
},
{
h1: '',
path2
}
],
[
{
h1: '',
path2
}
]
]
]
},
computed:{
charCheck (){
var arr = this.warning;
for(var z = 0; z < this.newAds.length; z++){
for(var i = 0; i < this.newAds[z].length; i++){
if(this.newAds[z][i]['boolean'] === true){
for(var key in this.newAds[z][i]){
if(key !== 'boolean' && key !== 'id'){
var length = this.newAds[z][i][key].replace(/_keyword_/g, this.options[z]).length;
if( key === 'headline1' || key === 'headline2' || key === 'headline3'){
if(length > 30){
this.warning[z][i].push(key)
}
} else if( key == 'desc1' || key == 'desc2'){
if(length > 90){
this.warning[z][i].push(key)
}
} else if( key == 'path1' || key == 'path2'){
if(length > 15){
if(!this.warning[z][i].includes(key)){
this.warning[z][i].push(key)
}
}
}
}
}
}
}
}
return arr[this.keywordIndex];
},
keywordIndex (){
var activeKeyword = this.options.indexOf(this.activeKeyword)
Vue.set(this.activeAd, 0, activeKeyword)
return this.activeAd[0]
}
}