美文网首页
选项卡的写法

选项卡的写法

作者: 天堑 | 来源:发表于2022-08-10 16:23 被阅读0次

wxml的选项卡菜单:

<view class="tabNav">
     <view class="li {{tabindex==1?'cur':''}}" data-tabindex='1' bindtap="changeIndex">菜单1</view>
     <view class="li {{tabindex==2?'cur':''}}" data-tabindex='2' bindtap="changeIndex">菜单2</view>
  </view>

wxml-选项卡内容:

<view class="con {{tabindex==1?'on':''}}" >内容1  </view>
<view class="con {{tabindex==2?'on':''}}" >内容2   </view>

js部分:

data: {        
        tabindex:1
 },
changeIndex:function(e){
        var index =e.currentTarget.dataset.tabindex;
        this.setData({tabindex:index});
},

相关文章

  • 选项卡轮播三种写法

    选项卡轮播普通写法 选项卡轮播抽离优化写法 选项卡轮播再抽离优化

  • 选项卡的写法

    wxml的选项卡菜单: wxml-选项卡内容: js部分:

  • 选项卡js的写法

    三个按钮,点击不同的按钮时,按钮的背景色出现同一种颜色, window.onload=function{ ...

  • 选项卡原生JS写法

    选项卡是我们工作中常用到的方法,日常生活中总喜欢用jquery来写,下面我为大家总结了几种原生方法,供参考:先上静...

  • 多层选项卡轮播es6写法 与es5添加删除类名写法

    多层选项卡轮播es6写法 ES5添加删除类名需要切割数组拼接数组,ES6使用classList

  • 2018-11-08 js/jquery原生实现tab选项卡功能

    分享下我自己用jquery(也可以换成js原生,只是写法有些许区别)手写的tab选项卡功能的demo主要思想就是给...

  • js选项卡

    选项卡的两种写法: 1. 在ul 的 li 里面遍历,绑定索引,这个索引会给下面的 acont 使用,这里有两种方...

  • 原生JS函数

    兼容写法--获取运行完的样式 运动函数 选项卡函数 比较大小 到文档顶部位置: 该方法返回0到1之间的一个伪随机数...

  • js一些基础知识2

    72、按钮控制选项卡,加左右按钮实现 73、自动播放选项卡,定时运行按钮选项卡中的next 74、延时选项卡(京东...

  • 移动端选项卡——交互基础篇

    一:选项卡具体形式 首页选项卡 位置不一致,微博选项卡在导航栏位置 网易新闻选项卡在导航栏下面, 类目展示也是选项...

网友评论

      本文标题:选项卡的写法

      本文链接:https://www.haomeiwen.com/subject/jqjawrtx.html