微信小程序不支持css子元素nth-child()怎么办

Posted 2023-03-26

参考技术A 额 这个确实是不支持，只能看以后会不会更新

可以考虑更换一下布局，或者用js操作本回答被提问者采纳

微信小程序-bindtap事件子元素不传参

 

<ul id="tabBar">
    <li class="{{currentTabBar_s == 10?\'active\':\'\'}}" data-current="10" bindtap="swichTabN"><image src=\'../../images/icon/tab_MyTodo_s.png\' class=\'img_s\'></image><image src=\'../../images/icon/tab_MyTodo.png\' class=\'img_n\'></image><span>待办</span></li>
    <li class="{{currentTabBar_s == 11?\'active\':\'\'}}" data-current="11" bindtap="swichTabN"><image src=\'../../images/icon/tab_Customers.png\' class=\'img_n\'></image><image src=\'../../images/icon/tab_Customers.png\' class=\'img_s\'></image><span>客户</span></li>
    <li class="{{currentTabBar_s == 12?\'active\':\'\'}}" data-current="12" bindtap="swichTabN"><image src=\'../../images/icon/tab_Find.png\' class=\'img_n\'></image><image src=\'../../images/icon/tab_Find.png\' class=\'img_s\'></image><span>发现</span></li>
    <li class="{{currentTabBar_s == 13?\'active\':\'\'}}" data-current="13" bindtap="swichTabN"><image src=\'../../images/icon/tab_Achieve.png\' class=\'img_n\'></image><image src=\'../../images/icon/tab_Achieve.png\' class=\'img_s\'></image><span>业绩</span></li>
  </ul>

　　

 

 // 点击标题切换当前页时改变样式
  swichTabN: function (e) {
    var _this=this;

　　　var cur = e.target.dataset.current;    

 

　　//点击li的子级元素，不进行值改变，解决方法把取值方式  由e.target.dataset.current;  修改为e.currentTarget.dataset.current即可

    var cur = e.currentTarget.dataset.current;
    console.log(_this.data.currentTabBar_s)
    console.log(_this.data)
    if (this.data.currentTabBar_s == cur) { console.log(123);return false; }
    else {
      console.log(5687)
      this.setData({
        currentTabBar_s: cur
      })
    }
  },