本文为大家分享了微信小程序框架wepy之动态控制类名的具体实现方法,供大家参考,具体内容如下
控制类名
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 //默认让第一个tab高亮 } methods = { changeli(e){ this.licolor = e.target.dataset.wepyparamsa this.$apply() //通知wepy框架data数据更改需要重绘页面 } }
效果图
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持移动技术网。
如对本文有疑问, 点击进行留言回复!!
2016年信息安全工程师综合知识第11-15题解析【建群网培信息安全工程师】
网友评论