1.wxml中

<view class="column">
<view class="body-view {{num==1?'active':''}}" bindtap="bindChoice" data-num='1'>推荐</view>
<view class="body-view {{num==2?'active':''}}" bindtap="bindChoice" data-num='2'>热门</view>
<view class="body-view {{num==3?'active':''}}" bindtap="bindChoice" data-num='3'>分类</view>
</view>
2.js中
data{
   num:1
}
bindChoice:function(e){
   console.log(e);
   this.setData({
        num:e.target.dataset.num
})
}

小程序点击事件改变样式(普通js鼠标点击事件)的更多相关文章

  1. js 鼠标和键盘事件

    js 鼠标和键盘事件 鼠标事件 聚焦事件 离焦事件 鼠标单击和双击 鼠标的其他事件 鼠标事件对象 键盘事件 鼠标事件 聚焦事件 <input type="text" id=& ...

  2. js鼠标划过事件

    js鼠标划过事件一般有两对 onmouseover/onmouseout onmouseenter/onmouseleave 区别: 1.onmouseover/onmouseout 鼠标经过自身会触 ...

  3. 微信小程序radio组件 - 如何改变默认样式大小?

    今天在写小程序的时候用到radio组件,但是很懊恼并未提供修改radio组件大小属性,第一感觉准备用css width , height 改变radio的大小,但是怎么搞也无法改变. 但是又不愿意搞个 ...

  4. 微信小程序实现显示和隐藏控件-头像-取值-bindblur事件

    微信小程序实现显示和隐藏控件 .wxml: <view class=" {{showOrHidden?'show':'hidden'}}"></view> ...

  5. 微信小程序 text属性设置 WXSS样式

    >微信小程序的布局css样式 参考自  珺L 文字 width: fit-content;font-size:20px;      /*设置文字字号*/color:red;           ...

  6. 小程序获取地址授权的修改 wx.openSetting需点击

    开发者可以通过 wx.openSetting 接口来打开小程序设置界面并返回用户的设置结果.在原来的 wx.openSetting 接口中,我们允许开发者直接调用此接口,但目前我们发现有不少开发者滥用 ...

  7. 小程序echarts数据不改变,或者是一次渲染成功,第二次进入,渲染失败的解决办法

    1.引入echarts插件: import * as echarts from '../../ec-canvas/echarts'; 2.data中定义: ecBar: { onInit: initC ...

  8. 微信小程序入门四: 导航栏样式、tabBar导航栏

    实例内容 导航栏样式设置 tabBar导航栏 实例一:导航栏样式设置 小程序的导航栏样式在app.json中定义. 这里设置导航,背景黑色,文字白色,文字内容测试小程序 app.json内容: { & ...

  9. 微信小程序尺寸单位rpx以及样式相关介绍

    rpx单位是微信小程序中css的尺寸单位,rpx可以根据屏幕宽度进行自适应.规定屏幕宽为750rpx.如在 iPhone6 上,屏幕宽度为375px,共有750个物理像素,则750rpx = 375p ...

随机推荐

  1. Flask学习【第11篇】:整合Flask中的一些知识点

    SQLAlchemy-Utils 由于sqlalchemy中没有提供choice方法,所以借助SQLAlchemy-Utils组件提供的choice方法 import datetime from sq ...

  2. How to Install LibreOffice 6.0 on Ubuntu 16.04 LTS +

    1. Add the LibreOffice 6.0 PPA The LibreOffice Fresh PPA is maintained by LibreOffice. It provides l ...

  3. Markdown语法参考

    参考博客: https://www.jianshu.com/p/f3147a804368 https://www.jianshu.com/p/191d1e21f7ed https://www.jian ...

  4. methods 方法选项

    最简单的使用方法,一个数字,每点击一下按钮加1 html <div id="app"> <span v-text="number">&l ...

  5. (转载)C# winform 在一个窗体中如何设置另一个窗体的TextBox的值

    方法1:修改控件的访问修饰符.(不建议使用此法) public System.Windows.Forms.TextBox textBox1; 在调用时就能直接访问 Form1 frm = new Fo ...

  6. (转载)c# winform comboBox的常用一些属性和用法

    comboBox的常用一些属性和用法 [1].控件的默认值怎么设? this.comboBox1.Text = "请选择港口"; comboBox1.Items.Add(" ...

  7. Bytom移动端钱包SDK开发基础

    比原项目仓库: Github地址:https://github.com/Bytom/bytom Gitee地址:https://gitee.com/BytomBlockchain/bytom Byto ...

  8. python学习 day15打卡 初识面向对象

    本节主要内容: 1.面向对象和面向过程 2.面向对象如何编写 3.面向对象和面向过程的对比 4.面向对象的三大特征 一.面向对象和面向过程(重点理解) 1.面向过程:一切以事物的流程为核心.核心是&q ...

  9. jmeter命令行模式运行,实时获取压测结果

    jmeter命令行模式运行,实时获取压测结果 jmeter很小,很快,使用方便,可以在界面运行,可以命令行运行.简单介绍下命令行运行的方式: sh jmeter.sh -n -t my-script. ...

  10. ERR! registry error parsing json

    报错日志: ERR! registry error parsing json ERR! registry error parsing json 解决过程: 从github上克隆一个项目,在npm i的 ...