微信小程序wx:for循环的用法

今天写小程序的循环循环,估计是之前tp写习惯了,用wx:for的时候一直把它放在ul标签里,导致他最后循环出的结果是一串ul,但我实际上是想循环里面的li,所以记录一下,免得以后忘记了。

示例:

<ul class="demo-ul" >
               <block  wx:for='{{demo}}' wx:key='id'>
                 <li class="demo-ul-li" >
                   <navigator class="demo-ul-a" url="/pages/demo/content/content?id={{item.id}}">
                     <image class="demo-ul-li-img"
                      src="https://www.xinhuang.net.cn/{{item.img}}" moede='widthFix'></image>
                     <view class="demo-ul-li-p" style="overflow:hidden;">{{item.name}}</view>
                   </navigator>
                 </li>
               </block>
</ul>

wx:for是循环标志,里面的值是要循环的数组,wx:key是分类标志,这两个是必要的,原先应该安在li里面,但根据小程序的建议,我在li外加了一层block,并把循环标志写在了里面。

在需要使用数据的地方就用双大括号语法({{}})写上item.你要使用的数据,item代表的是数组当前条的所有数据。

posted @ 2020-04-18 12:38  远方的异特  阅读(5530)  评论(0编辑  收藏  举报