• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

微信小程序for循环wx:for和wx:ifwx:elif嵌套着使用

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

 

 

<view class='Mall_title'>
    <block wx:for="{{mall_title_object}}" wx:key="{{index}}">
      <view class="h_item {{num==index?'current':''}}" catchtap='switchTab'  data-index="{{index}}">
        <text>{{item}}</text>
        <view class='b_line'></view>
      </view> 
    </block>
  </view>
  <view wx:if="{{curIndex==1}}" class='con_bottom'>
    <block wx:for="{{class_object}}" wx:key="{{index}}">
    <navigator url='{{item.class_url}}'>
      <view class='b_class'>
        <image src='../../images/class_img.png' style='width:166rpx;height:166rpx;margin-right:20rpx;'></image>
        <view class='class_detail'>
          <text class='class_name'>{{item.class_title}}</text>
          <text>{{item.class_name}}</text>
          <text>{{item.class_time}}</text>
        </view>
        <view class='teacher_name'>
          <text>{{item.class_teacher}}</text>
          <text>{{item.class_kd}}</text>
        </view>
      </view>
    </navigator>
    </block> 
  </view>
  <view class='jf_list' wx:elif="{{goods_object[curIndex]}}">
    <block wx:for="{{goods_object[curIndex]}}" wx:key="{{index}}">
    <navigator url='{{item.jf_url}}'>
      <view class='goods_list'>
        <image src='{{item.goods_img}}'></image>
        <view>{{item.goods_name}}</view>
        <view>{{item.goods_jf}}:<text>{{item.goods_price}}</text></view>
      </view>
    </navigator>
    </block>
  </view>

js:

mall_title_object:["积分商城","虚拟商品","实物商品"],
    class_object: [
      {
        class_title: "Hiphop",
        class_name: "共7课时",
        class_time: "明天-17:45-18:45",
        class_teacher: "赵卫斌",
        class_kd: "¥200",
        class_url: "../course_goods/course_goods"
      },
      {
        class_title: "Hiphop",
        class_name: "共7课时",
        class_time: "明天-17:45-18:45",
        class_teacher: "赵卫斌",
        class_kd: "¥200",
        class_url:"../course_goods/course_goods"
      },
      {
        class_title: "Hiphop",
        class_name: "共7课时",
        class_time: "明天-17:45-18:45",
        class_teacher: "赵卫斌",
        class_kd: "¥200",
        class_url: "../course_goods/course_goods"
      }
    ],
    goods_object:[
      [
      {
        goods_img:"../../images/mall1.png",
        goods_name:"圆领加绒大衣",
        goods_jf:"商品积分",
        goods_price:"8000",
        jf_url:"../jfgoods/jfgoods"
      },
      {
        goods_img: "../../images/mall2.png",
        goods_name: "圆领加绒大衣",
        goods_jf: "商品积分",
        goods_price: "8000",
        jf_url: "../jfgoods/jfgoods"
      },
      {
        goods_img: "../../images/mall1.png",
        goods_name: "圆领加绒大衣",
        goods_jf: "商品积分",
        goods_price: "8000",
        jf_url: "../jfgoods/jfgoods"
      },
      {
        goods_img: "../../images/mall2.png",
        goods_name: "圆领加绒大衣",
        goods_jf: "商品积分",
        goods_price: "8000",
        jf_url: "../jfgoods/jfgoods"
      }
      ],
      [],
      [
        {
          goods_img: "../../images/mall1.png",
          goods_name: "圆领加绒大衣",
          goods_jf: "商品价格",
          goods_price: "¥8000",
          jf_url:"../actual_goods/actual_goods"
        },
        {
          goods_img: "../../images/mall2.png",
          goods_name: "圆领加绒大衣",
          goods_jf: "商品价格",
          goods_price: "¥8000",
          jf_url: "../actual_goods/actual_goods"
        },
        {
          goods_img: "../../images/mall1.png",
          goods_name: "圆领加绒大衣",
          goods_jf: "商品价格",
          goods_price: "¥8000",
          jf_url: "../actual_goods/actual_goods"
        },
        {
          goods_img: "../../images/mall2.png",
          goods_name: "圆领加绒大衣",
          goods_jf: "商品价格",
          goods_price: "¥8000",
          jf_url: "../actual_goods/actual_goods"
        }
      ]
    ],
    switchTab: function (e) {
        let index = parseInt(e.currentTarget.dataset.index),
          num = parseInt(e.currentTarget.dataset.index),
          curIndex = parseInt(e.currentTarget.dataset.index)
        // console.log(curIndex)
        var that = this
        this.setData({
          curIndex: index,
          num: index
        })
      },

 参考:https://www.cnblogs.com/lijuntao/p/7151234.html


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
小程序login发布时间:2022-07-18
下一篇:
基于微信小程序的实验室管理系统Postmorterm发布时间:2022-07-18
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap