问题描述用vue的for循环,写了一些div,但是我需要在绑定的div的子/孙节点上面添加click事件,我怎么取得当前的这个对象,或则怎么实现点击哪个 哪个变色的效果,而不是全部!!! 我已经写了一个简单的页面,请帮忙调试!<!DOCTYPE html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <script src="https://cdn.bootcss.com/vue/2.6.9/vue.min.js"></script> <style> * { padding: 0; margin: 0; } .boxlist { width: 100%; height: auto; border: 1px solid grey; padding: 20px; } .box { height: 100px; width: 100%; border: 1px solid green; } .showbox { width: 100%; height: 50px; background-color: bisque; } .editbox { width: 100%; height: 50px; background-color: chartreuse; } </style></head><body> <div class="boxlist"> <div class="box" v-for="item in list"> <div class="showbox" v-if="showbox"> <div class="title"></div> <div class="header">header</div> <input type="button" value="编辑" @click="showval" /> </div> <div class="editbox" v-else> <div class="title">111</div> <input type="button" value="保存" @click="hideval" /> </div> </div> </div> <script> new Vue({ el: ".boxlist", data: { list: [1, 2, 3, 4, 5], showbox: true }, methods: { showval: function () { this.showbox = false }, hideval: function () { this.showbox = true } } }) </script></body></html>
添加回答
举报
0/150
提交
取消