您好,欢迎来到化拓教育网。
搜索
您的当前位置:首页小程序wx:for、wx:for-items和wx:for-it

小程序wx:for、wx:for-items和wx:for-it

来源:化拓教育网

引言

在开发小程序的过程中很可能要实现展示列表的功能,大家首先想到的可能就是wx:for=''{{list}}''来实现,但如果遇到的是二维或者多维数组怎么办呢?那就得用wx:for-items和wx:for-item来实现了。

先看看数据结构

数据结构.jpg

上代码(.wxml)

<button class="modal-title" open-type="contact" session-from="weapp">联系客服</button> 

<view class = 'explain'>

  <view style="margin-bottom: 4%;margin-top: 6%">

    <view class="foot_box" wx:for="{{list}}" wx:key="{{index}}">

      <view style="color: #000000; font-size: 32rpx;font-weight:bold" >{{item.problem_name}}</view>
      
      <view wx:for-items="{{item.child}}" wx:key="{{index}}" data-id="{{item.id}}" data-url = "{{item.h5pageurl}}" bindtap='detail'  wx:for-item="item">

         <p>{{item.problem_description}}</p>

      </view>

    </view>

  </view>

</view>

运行效果

效果.png

ps:wx:for等价与wx:for-items 是循环数组用的;而wx:for-item 则是给列表赋别名用的。

Copyright © 2019- huatuo9.cn 版权所有 赣ICP备2023008801号-1

违法及侵权请联系:TEL:199 1889 7713 E-MAIL:2724546146@qq.com

本站由北京市万商天勤律师事务所王兴未律师提供法律服务