鍍金池/ 問答/HTML5  HTML/ vue 實現(xiàn)點擊元素的點擊功能

vue 實現(xiàn)點擊元素的點擊功能

                    <div v-for="item in forum[1]" class="comment">
                        <!-- 回復(fù)評論 -->
                        <span ref="spanid" class="none">{{item.id}}</span>
                        <img @click="com_pe" width="70" height="60" class="lun-img" :src="item.head_img"></img>
                        <div class="tim">{{item.addtime}}</div>
                        <div class="name">{{item.phone}}</div>
                        <div class="c_speak">{{item.content}}</div>
                        <!-- 點贊 -->
                        <i @click="Comment_zan(item)" class="com_i czan icon-favorite"><span class="com num">{{item.is_love}}</span></i>
                    </div>

// 評論第一個人點贊
Comment_zan(item) {

getComment($('.com').html()).then((res) => {
      if (res.status === ERR_OK) {
                    $('.com_i').html(res.data.data.is_love)
                }
            })
            if (parseInt($('.com').html()) - 1) {
                $('.com_i').css('color', 'red')
            } else {
                $('.com_i').css('color', '#008000')
            }
        },

clipboard.png

回答
編輯回答
綰青絲

$('.com_i')取到所有列表的心的dom了，不能用class選擇。還有你用了vue可以不用dom選擇器。

2017年1月23日 07:09
編輯回答
檸檬藍

clipboard.png

2017年1月31日 13:53
編輯回答
純妹

用vue的話，就不要總想著通過DOM實現(xiàn)操作了，jquery基本可以不用了，多用數(shù)據(jù)驅(qū)動。

比如你的這個例子，你點贊的時候，通過點擊是可以知道對哪個用戶(item)點贊的對不對，所以在item上，給對應(yīng)的屬性直接改就好了，頁面上會自動更改的，包括點贊之后的樣式，也可以通過一個屬性控制，就不用每次手動操作DOM了。

2017年3月13日 05:29