vue多个元素绑定自定义指令，若删除其中一个元素，则其他元素的指令顺序会出现错误

Question

template

data

directives

• 单击的时候会打印该元素的text

• 双击的时候会删除该元素

Answer 1

如果你只是想实现单击的时候打印该元素的text，双击的时候会删除该元素，那么使用vue的事件绑定不是更简单？<p v-for="(item,index) in aa" :key="index" @click="log(item.text)" @dblclick="spl(index)">{{item.text}}</p>methodslog(i){console.log(i)},spl(i){this.aa.splice(i,1)}

Answer 2

文档有说明除了 el 之外，其它参数都应该是只读的，切勿进行修改建议您给元素自定义属性 通过自定义属性取值<a href="javascript:;" v-for='item in aa' v-click="{i:item.text}" :data="item.text">{{item.text}}</a>&nbsp;function a() {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; console.log(this.getAttribute('data'))&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }

Answer 3

自己最后的解决方案是，在其父元素绑定自定义指令。用event.target获取点击得元素。这个时候删除数组元素还是修改都不会出现问题了。