关注公众号:青山有路

小程序列表toggle效果显示和隐藏

小程序 admin 7年前 (2018-03-13) 2526次浏览 已收录 0个评论 扫描二维码

小程序列表toggle效果显示和隐藏

xml:

<view class=”qbox” wx:for=”{{items}}”>
<viewclass=”li”bindtap=”showfun”id=”{{item.id}}”>{{index+1}}、{{item.title}}</view>
<viewclass=’con’style=”display:{{uhide==item.id ? ‘block’:’none’}}”>{{item.des}}</view>
</view>
js:
data: {
        uhide: 0,
        items: [
                { title: ‘下单后如何修改订单’, id: 1, des: ‘地址修改,如果没有被抢单’, display: ‘none’ },
                { title: ‘view2’, id: 2, des: ‘地址修改,如果没有被抢单’, display: ‘none’ },
        ]
},
showfun: function (event){
        console.log(event)
        var that = this;
        var toggleBtnVal = that.data.uhide;
        var itemId = event.currentTarget.id;
        if (toggleBtnVal == itemId) {
                that.setData({
                        uhide: 0
                })
        } else {
              that.setData({
                     uhide: itemId
               })
       }
}


版权所有丨如未注明 , 均为原创 , 转载请注明小程序列表toggle效果显示和隐藏
喜欢 (1)

Warning: Use of undefined constant PRC - assumed 'PRC' (this will throw an Error in a future version of PHP) in /www/wwwroot/gaowenjie.cc/wp-content/themes/Git-alpha/comments.php on line 17
发表我的评论
取消评论

表情 贴图 加粗 删除线 居中 斜体 签到