鍍金池/ 問答/Python  HTML/ vue添加點(diǎn)擊之后的樣式問題

vue添加點(diǎn)擊之后的樣式問題

如何給左側(cè)的按鈕添加點(diǎn)擊之后的效果(也就是說現(xiàn)在點(diǎn)擊沒效果，不看地址欄都不知道自己點(diǎn)了哪個(gè))

問題是這里要出現(xiàn)兩個(gè)點(diǎn)擊事件，我試了好多方法都不行

這里我用到了Vue的動(dòng)態(tài)路由匹配

.itemLeft
    .topicItem(@click="$router.push('/hottopic/topic/小微企業(yè)專題')") 小微企業(yè)專題
    .topicItem(@click="$router.push('/hottopic/topic/固定資產(chǎn)出租專題')") 固定資產(chǎn)出租專題
    .topicItem(@click="$router.push('/hottopic/topic/視同銷售專題')") 視同銷售專題
    .topicItem(@click="$router.push('/hottopic/topic/營改增專題')") 營改增專題
.itemRight
    p(v-for="(i,n) in data" :key="n" @click="$router.push('/hottopic/details?id='+i.id)") {{i.title}}

圖片描述
圖片描述

回答
編輯回答
胭脂淚
  1. 用<router-link>標(biāo)簽的話有專用的activerouter-link-active和router-link-exact-active。
  2. 用js跳轉(zhuǎn)的話就判斷<tag @click="xxx" :class="{active: name === $route.name/(或者route.params.name等等)}"/>吧。
2017年1月5日 19:45
編輯回答
柒槿年

問題已解決，正確答案：

.topicItem(:class="$route.params.id==='小微企業(yè)專題' ? 'active' : ''" @click="$router.push('/hottopic/topic/小微企業(yè)專題')") 小微企業(yè)專題
.topicItem(:class="$route.params.id==='固定資產(chǎn)出租專題' ? 'active' : ''" @click="$router.push('/hottopic/topic/固定資產(chǎn)出租專題')") 固定資產(chǎn)出租專題
.topicItem(:class="$route.params.id==='視同銷售專題' ? 'active' : ''" @click="$router.push('/hottopic/topic/視同銷售專題')") 視同銷售專題
.topicItem(:class="$route.params.id==='營改增專題' ? 'active' : ''" @click="$router.push('/hottopic/topic/營改增專題')") 營改增專題
2018年4月16日 05:11
編輯回答
忘了我

你路由怎么配的

2017年3月12日 12:15
編輯回答
陪我終

在左側(cè)加一個(gè)標(biāo)識(shí)來識(shí)別當(dāng)前的選中項(xiàng)吧；每一個(gè)li對(duì)應(yīng)的路由是已知的；然后通過router.name來做判斷；為true是有該選中樣式

2017年6月6日 16:46
編輯回答
淡墨

聲明時(shí)導(dǎo)航吧，router-link

2018年3月29日 07:26
編輯回答
故林
router-link.topicItem(tag="div", to="/hottopic/topic/小微企業(yè)專題", active-class="active")

還是覺得用router-link好點(diǎn)。
https://router.vuejs.org/zh-c...

2018年8月22日 15:58