vue遍历按钮添加事件

HTML

<el-col :span="8" v-for="(item,index) in channelControl.channel" :key="item.id">
<el-card class="box-card">
<p class="inline borderp10"><span  class="Sname">cron：</span>

<span v-show="!item.flagblur">{{item.cron}}</span>
<el-input v-show="item.flagblur" v-model="item.cron"></el-input>
<p
:class="{'el-icon-edit': !item.flagblur, 'el-icon-check': item.flagblur}"
@click="savesync(item,index,cron)"
></p>
点击事件
</p>
<p class="borderp10"><span  class="Sname">id：</span><span>{{item.id}}</span></p>
<!-- <p class="borderp10"><span  class="Sname">timeRange：</span><span>{{item.timeRange}}</span></p> -->
<p class="inline borderp10"><span  class="Sname">timeRange：</span>

<span v-show="!item.flagrange">{{item.timeRange}}</span>
<el-input v-show="item.flagrange" v-model="item.timeRange"></el-input>
<p
:class="{'el-icon-edit': !item.flagrange, 'el-icon-check': item.flagrange}"
@click="flagrangeclick(item,index,timeRange)"
></p>
</p>

</el-card>
</el-col>

js

data{
cron:false,
timeRange:false,
}

savesync(item,index){
if(!item.flagblur){
this.channelControl.channel[index]['flagblur'] = true
}else{
this.channelControl.channel[index]['flagblur'] = false
}
this.channelControl.channel[index] = item
},
flagrangeclick(item,index){
if(!item.flagrange){
this.channelControl.channel[index]['flagrange'] = true
}else{
this.channelControl.channel[index]['flagrange'] = false
}
this.channelControl.channel[index] = item
}

遍历增加事件

<div class="fl" v-for="childitem in item.property" :key="childitem.id">
<p class="titlename">{{childitem.name}}：</p>
<span  v-show="!childitem.show">{{ childitem.value | capitalize}}</span>
<el-input v-show="childitem.show" v-model="childitem.value"></el-input>
<p
:class="{'el-icon-edit': !childitem.show, 'el-icon-check': childitem.show}"
@click="childitem.show = !childitem.show"
></p>
</div>

js

let connectorArr=res.data.bridgeInfo.connectUpInfo.connector
let propertyArr=[]
for(var i=0;i<connectorArr.length;i++){//循环数组
propertyArr.push(connectorArr[i].property)
}
let newArr=[]
for(var i = 0; i < propertyArr.length;i++){
for(var j = 0; j < propertyArr[i].length;j++){
newArr.push(propertyArr[i][j])
}
}
// console.log("newArr",newArr)
for(var i=0;i<newArr.length;i++){//循环数组
// console.log("aaaaaa",newArr[i].encode)
if(newArr[i].encode==true){
newArr[i].value=base64.decode(newArr[i].value)
}
}
// console.log("newArr",newArr)
newArr.forEach(function(item){
_this.$set(item, 'show', false)
})

提交

for (i = 0; i < saveArr.length; i++) {
delete  saveArr[i].show
}