1、引入组件

2、state中设置选中状态

  // button按钮的默认选中,0代表选中
  state = {
    currentIndex: 0
  }
3、设置class的样式,点击更改选中

  selectNew(){
    this.setState({currentIndex:0});
  }
  selectOld(){
    this.setState({currentIndex:1});
  }

Taro button点击切换选中状态的更多相关文章

  1. RecyclerViewSelectableAdapterDemo【封装BaseSelectableAdapter用于多选、单选,以及切换选中状态等功能】

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 记录封装单选.多选.切换选中状态的BaseSelectableAdapter基类,配合Recyclerview使用. 注意:此Dem ...

  2. jquery checkbox 复选框多次点击判断选中状态,以及全选/取消的代码示例

    2015年12月21日 10:52:51 星期一 目标, 点击当前的checbox, 判断点击后当前checkbox是否是选中状态. html: <input type="checkb ...

  3. 用js实现超链接导航菜单点击切换选中时的状态

    项目中使用到点解导航切换不同的颜色,如果只是li选项卡还好办,这次用到的超链接选项卡,因为a链接每次点击都会刷新,所以浏览器记不住点击的状态,也没法切换点击状态,因为项目中有好多地方要用到,在网上找了 ...

  4. jQuery实现点击单选按钮切换选中状态效果

    实现效果:第一次点击单选按钮时选中该按钮,再次点击时取消选中该单选按钮. 关键就是要将单选按钮原来的值保存起来,第二次点击时.如果原来选中则取消,否则选中. 看代码吧,是用jQuery实现的,功能虽小 ...

  5. 用js实现导航菜单点击切换选中时高亮状态

    随着用户点击导航或菜单上不同的页面,出现此选项高亮显示或变为一个新的样式是经常用到的.实现它所用的原理就是通过js中的location.href得到当前页面的地址,然后在与导航上的链接地址匹对,相同的 ...

  6. 微信小程序切换选中状态

     实现的主要思路是根据每一项的index值,动态改变idx值,当index==idx值的时候,添加点击选中样式的类名. wxml: <scroll-view scroll-x="tru ...

  7. button点击切换,获取按钮ID

    <!DOCTYPE html> <html> <head lang="zh-CN"> <meta charset="UTF-8& ...

  8. jq 实现切换菜单选中状态

    点击导航菜单,切换选中状态 效果: 思路:首先获取选中的URL,再通过正则判断是否相同,相同就加上相应的属性,不相同就去除相应的属性. html代码 <div class="layui ...

  9. jQuery控制checkbox选中状态但是不显示选中

    问题描述:使用jQuery来控制checkbox的选中状态,但是第一次点击出现选中样式,之后点击可以看到checked的属性增加成功但是并没有选 中状态. 问题代码: function chooseA ...

随机推荐

  1. Springboot jar包外指定配置文件及原理

    解决方案: 修改maven的pom.xml文件 不拷贝资源文件 <resources> <resource> <directory>src/main/resourc ...

  2. ES6 实战项目构建 ES6+glup+express

    ES6推出已经有几个年头了,平时也有学过一些基本语法,无奈实践经验太少.而且前端早已脱离了刀耕火种的时代,一些自动化构建工具像gulp.webpack等也需要熟练掌握.最近刚签了三方,闲暇之余就找了个 ...

  3. Ubuntu下安装Snap

    介绍 Snap是一个全新的软件包架构,它与其它包管理器的区别在于snap安装的app互相之间是高度隔离的,减少了互相引用. 避免了很多冲突问题. 不过这也导致了其占用的磁盘比较多. 安装 apt in ...

  4. WPF常用TriggerAction用法 (一)

    Microsoft.Expression.Interactivity 常用TriggerAction-> CallMethodAction ChangePropertyAction Contro ...

  5. 小程序坑之 swiper组件

    表现:swiper 内容 空白 原因:swiper组件的current值为n时,重新刷新页面,current值不变,当刷新后的swiper item的数量少于 n 时,swpier找不到对应的item ...

  6. Flex 布局的教程

    前言:以前也经常用flex布局,但是最近看到别人使用的时候,发觉以前自己还是不够理解这个,重新看了一遍http://www.ruanyifeng.com/blog/2015/07/flex-gramm ...

  7. T4代码生成脚本从添加注释,添加命名空间开始(一款强大的代码生成工具从看懂脚本,到随心所欲的玩弄代码,本文只是T4的冰山一角,博主将不断深入探索并完善该文章)

    精通T4脚本要从读懂脚本的关键代码片段开始  1.1. 给类添加注释-->看懂类对应的代码:<#=codeStringGenerator.EntityClassOpening(entity ...

  8. QMap迭代器

    QMap<int, QString> intToStr; intToStr[] = "test" for (auto iter = intToStr.begin(); ...

  9. QVector也是隐式数据共享的

    Behind the scenes, QString uses implicit sharing (copy-on-write) to reduce memory usage and to avoid ...

  10. Storm实现实时大数据分析(storm介绍,与Hadoop比较,)

    一.storm与Hadoop对比 Hadoop: 全量数据处理使用的大多是鼎鼎大名的hadoop或者hive,作为一个批处理系统,hadoop以其吞吐量大.自动容错等优点,在海量数据处理上得到了广泛的 ...