微信小程序如何动态增删class类名

摘要:
因此,应该不可能直接从js中添加类名。但我们可以使用微信小程序数据绑定和视图标签的“data-”,使第一个视图颜色为红色data:}。cur编写样式。cur{border-bottom:color:function(e){letid=e.currentTarget.dataset.id,

由于微信小程序开发不同于以往的普通web开发, 因此无法通过js获取wxml文件的dom结构, 因此从js上直接添加一个类名应该不可能了. 可是我们可以通过微信小程序数据绑定以及view标签的”data-“自定义属性去更改标签类名.

微信小程序如何动态增删class类名第1张

微信小程序如何动态增删class类名第2张

 num记得设置默认值 ,这样第一个view颜色会是红色的

data:{

 num:0,

}

.cur写上样式
.cur{
   border-bottom: 4rpx solid #f23232;
  color: #f23232; 
}
switchTab:function(e){
    let id=e.currentTarget.dataset.id,
    index=parseInt(e.currentTarget.dataset.index),
    num=parseInt(e.currentTarget.dataset.index)
    this.curIndex=parseInt(e.currentTarget.dataset.index)
    console.log(e)
    var that=this
    this.setData({
      curNavId:id,
      curIndex:index,
      num:index
    })
  },

参考自:http://blog.csdn.net/c_kite/article/details/72899520 

免责声明:文章转载自《微信小程序如何动态增删class类名》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇JSON Schema【JEECG技术文档】JEECG平台对外接口JWT应用文档V3.7.2下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

高级着色语言HLSL入门

  http://www.bullock.cn/blogs/geeker/archives/68700.aspx 高级着色语言HLSL入门(1) 在我们写的程序里顶点和像素是很小的对象,它们由GPU来执行,是固定功能管线的一部分。用我们自己写的着色器程序替换一部分固定功能管线,在绘制效果上我们获得很大的灵活性。我们不再局限于预定义的"固定"操作。 为了...

【XStream】xml和java实体的相互转化

1.pom.xml <!-- xstream xml和Java对象转化 --> <dependency> <groupId>xstream</groupId> <artifactId>xstream</artifactId...

WPF自定义控件的制作

  因为有时候需要定制化的控件,需要多个控件的组合及复杂功能的集成,这样可以考虑自定义用户控件。下面分享一个简单的数值增减功能的自定义控件作为说明。 效果图如下: 1、创建自定义用户控件(添加->新建项->用户控件) 2、编写XAML <UserControl x:Class="XXX.自定义控件.MyNumericUpDown"...

mpvue 使用echarts动态绘制图表(数据改变重新渲染图表)

  最近在公司开发一款微信小程序,按照客户需求用饼状图显示当前设备状态(开机、故障、关机),于是就在网上寻找各种资料,找了很多mpvue使用关于echarts绘制图表,最终功夫不负有心人,找到一篇关于mpvue使用echarts的文章,链接点击这里,需要的同学自行查看。这里面说明了如何使用echarts绘制图表,其中echarts的配置项option大家可...

[WPF] 如何调试Data Binding

前言 在WPF开发中,将ViewModel中对象绑定到UI上时,会出现明明已经将数据对象Binding到UI,但是UI上就是不显示等等的问题。这篇博客将介绍WPF Data Binding调试相关的内容。 场景一(Binding的属性不存在) ViewModel: public partial classMainWindow : Window {...

vuejs导航条动态切换active状态

用一个数组存导航条,用v-for循环它,这样可以减少代码,二可以使用它的下标来判断高亮,三还可以获取后端的导航信息来遍历 重点是在:routerLink(index, path)函数,传入当前点击的下标,自定义一个下标,判断是否相等就用三元符号判断多给一个高亮样式 如何解决刷新就不高亮或第一个高亮了,很简单,监听一下当前路由在判断就好了 具体代码都在下...