微信小程序框架wepy之動態(tài)控制類名
更新時間：2018年09月14日 15:13:02 作者：kingov
這篇文章主要為大家詳細(xì)介紹了微信小程序框架wepy之動態(tài)控制類名，具有一定的參考價值，感興趣的小伙伴們可以參考一下
本文為大家分享了微信小程序框架wepy之動態(tài)控制類名的具體實(shí)現(xiàn)方法，供大家參考，具體內(nèi)容如下
控制類名
style
<style lang="less" scoped>
.liBkgCor {
background-color: red;
}
</style>
template
<view class="t_tab">
<li @tap.stop="changeLi({{1}})" class="{{ liColor == 1 ? 'liBkgCor':'' }}">推薦</li>
<li @tap.stop="changeLi({{2}})" class="{{ liColor == 2 ? 'liBkgCor':'' }}">洗手臺</li>
<li @tap.stop="changeLi({{3}})" class="{{ liColor == 3 ? 'liBkgCor':'' }}">淋浴</li>
<li @tap.stop="changeLi({{4}})" class="{{ liColor == 4 ? 'liBkgCor':'' }}">馬桶</li>
</view>
script
data = {
liColor:1 //默認(rèn)讓第一個tab高亮
}
methods = {
changeLi(e){
this.liColor = e.target.dataset.wepyParamsA
this.$apply() //通知wepy框架data數(shù)據(jù)更改需要重繪頁面
}
}
效果圖
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
您可能感興趣的文章:
相關(guān)文章
javascript字符串循環(huán)匹配實(shí)例分析
這篇文章主要介紹了javascript字符串循環(huán)匹配,實(shí)例分析三種常用的字符串循環(huán)匹配的使用技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-07-07
Moment.js 不容錯過的超棒Javascript日期處理類庫
moment.js是一個輕量級并且健壯的js日期處理類庫，相信大家在javascript開發(fā)過程中，都自己動手寫過，或者使用google和百度搜索過相關(guān)的實(shí)現(xiàn)函數(shù)2012-04-04
JavaScript中this關(guān)鍵字用法實(shí)例分析
這篇文章主要介紹了JavaScript中this關(guān)鍵字用法,結(jié)合實(shí)例形式總結(jié)分析了javascript中this關(guān)鍵字在不同條件下的指向問題與相關(guān)操作技巧,需要的朋友可以參考下2018-08-08
這篇文章主要介紹了JavaScript實(shí)現(xiàn)櫥窗展示效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-11-11
關(guān)于js中e.preventDefault()的具體使用
本文主要介紹了關(guān)于js中e.preventDefault()的具體使用，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-04-04
JavaScript簡單實(shí)現(xiàn)彈出拖拽窗口（二）
這篇文章再次為大家詳細(xì)介紹了JavaScript簡單實(shí)現(xiàn)彈出拖拽窗口的相關(guān)資料，具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-06-06
JSON一種簡單的數(shù)據(jù)格式，比xml更輕巧，在JavaScript中處理JSON數(shù)據(jù)不需要任何特殊的API或工具包，下面為大家詳細(xì)介紹下js中的json對象2014-10-10
js網(wǎng)頁側(cè)邊隨頁面滾動廣告效果實(shí)現(xiàn)
其實(shí)這個效果不是什么難實(shí)現(xiàn)的效果，關(guān)鍵注意幾個地方就可以了2011-04-04
這 開發(fā)中如果有input輸入框，難免就要寫正則表達(dá)式，因此在這里總結(jié)了一些常見常用的正則表達(dá)式的書寫方法,需要的朋友可以參考下2018-10-10
一文詳解JavaScript中的事件循環(huán)(event?loop)機(jī)制
JavaScript中的事件循環(huán)（Event?Loop）是一種重要的機(jī)制，用于管理異步代碼的執(zhí)行，它確保?JavaScript?單線程環(huán)境中的任務(wù)按照正確的順序執(zhí)行，同時允許異步操作如定時器、網(wǎng)絡(luò)請求和事件處理，本將給大家詳細(xì)的介紹一下JavaScript事件循環(huán)機(jī)制,感興趣的朋友可以參考下2023-12-12