Question

vue v-for 为元素添加点击事件的时候怎么才能处理当前dom元素

Answer 1

从数据结构着手，做关注的话，你的数据中得有关注这个字段

data: function () {   

return {

msgs: [] // [{focus: true}]

}

},

methods: {

focusFun: function (msg) {

msg.focus != msg.focus; // 切换 关注 状态

}

}

然后调整下html

<div class="zan">    

<!-- 1. 将item传进去 -->

<!-- 2. 根据focus字段设置class -->

<p :class="[item.focus ? 'focus' : '']" @clik="focusFun(item)">关注</p> </div>

创建新的 HTML 元素添加dom元素的方法：

<div id="div1">

<p id="p1">This is a paragraph.</p>

<p id="p2">This is another paragraph.</p>

</div>

<script>

var para=document.createElement("p");

var node=document.createTextNode("This is new.");

para.appendChild(node);

var element=document.getElementById("div1");

element.appendChild(para);

</script>