html5按钮怎样改变背景颜色,v-for循环中如何改变点击当前按钮的背景色，再次点击恢复原来的背景色...

html>

Document

• {{v.level}}

  :style="{background: btnsClickBol[i][j]?'red':''}"

  @click="onClick(i,j)"

  >{{key}}

new Vue({

el: '#app',

data: {

items: [],

btnsClickBol: [],

},

created() {

// 延迟模拟ajax请求

setTimeout(() => {

const response = [{level: 'L1',theWords: [{'see': '看见'},{'at':'在'},{'play': '玩'}]}];

this.items = response;

// 或者修改返回的数据，插入按钮的状态也可以

// 封装成组件是更好的办法，因为状态是属于button私有的，在组件内定义状态更好，修改也在内部执行即可

this.btnsClickBol = response.map(v => Array(v.theWords.length).fill(false));

},1000)

},

methods: {

onClick(i,j) {

this.$set(this.btnsClickBol[i],j,!this.btnsClickBol[i][j]);

},

}

})