javascript - 微信小程序在wx:for循环里判断数据再给类名,条件为动态时无效
迷茫
迷茫 2017-04-17 15:24:11
0
2
503

直接写数字去判断可以,写index就不行,{{tabArr.curHdIndex=='{{index}}'? 'classify-left-select' : ''}}这句出错

<view class="classify-left" style="height:{{leftHight}}" bindtap="tabFun">
    <block wx:for="{{Data}}" wx:for-item="group" wx:for-index="index">
      <view class="classify-left-item {{tabArr.curHdIndex=='{{index}}'? 'classify-left-select' : ''}}" data-id="{{index}}">{{group.Group.Name}}</view>
    </block>
  </view>
<view class="classify-right">
    <block wx:for="{{Data}}" wx:for-item="group">
      <view class="classify-right-item {{tabArr.curBdIndex=='{{index}}'? 'classify-right-select' : ''}}">
        <image class="classify-img-banner" src="{{group.Group.IconUrl}}"></image>
        <view class="classify-right-tag">
          <navigator wx:for="{{group.Tags}}" wx:for-item="Tags" url="/pages/productlist/productlist?loadtype=tag&keyword={{Tags.ProductTagID}}" hover-class="navigator-hover">
            <image src="{{Tags.IconUrl}}"></image>
            <text>{{Tags.TagName}}</text>
          </navigator>
        </view>
      </view>
    </block>
  </view>

生成xml如下:

<viewclass="classify-left"style="height:">
<viewclass="classify-left-item "data-id="0">母婴</view>
<viewclass="classify-left-item "data-id="1">护肤</view>
<viewclass="classify-left-item "data-id="2">彩妆</view>
<viewclass="classify-left-item "data-id="3">个护家居</view>
<viewclass="classify-left-item "data-id="4">食品保健</view>
<viewclass="classify-left-item "data-id="5">服饰鞋包</view>
</view>

可以看出,类名并未以index判断输出。。求指出错误

迷茫
迷茫

业精于勤,荒于嬉;行成于思,毁于随。

reply all(2)
黄舟
 <view class="classify-left-item {{tabArr.curHdIndex==index? 'classify-left-select' : ''}}" data-id="{{index}}">{{group.Group.Name}}</view>
大家讲道理

Everything within double curly brackets will be parsed and executed. The entire '{{index}}' in tabArr.curBdIndex=='{{index}}' is treated as a string. Of course, it is always false and is rendered naturally. is empty.

Just write tabArr.curHdIndex==index to judge correctly.

Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template