Question

[求助]微信小程序二维数组在wxml中列表渲染

js页面中的赋值 hkmxsz [5]

0 [6]
0 : 2019-05-21

1 : 星期二

2 ： 家电

3 :早9晚5

4 : 537

5 : 5722
1 [6]

2 [6]

3 [6]

4 [6]
在wxml在列表展示出来：
<block wx:for="{{hkmxsz}}" wx:key='id1'>
<van-row gutter="5">
<block wx:for="{{item}}" wx:key='id2'>
<van-col span="4"> {{item}}</van-col>
</block>
</van-row>
</block>
但我想指定下标，就是不想全部展示item数据，有什么办法

Answer 1

这个问题，如果条件允许，最好在后台程序中解决，在后台读取出图片路径数据后，立刻就分割为数组，然后把所有数据按json格式返回给小程序，小程序再把它放入page的data中，这样小程序无须大的改动就能显示图片了。
如果这个办法行不通，也可以在小程序获得后台返回的json数据后，先把其中的图片路径数据（即用：分隔的多个图片路径的字符串）用split分割为数组，再放入page的data中，这样小程序的wxml文件也不需要大改就能显示多个图片了。
如果实在懒得很，后台返回的数据一股脑的直接放到page的data中，那么还有最后的一种解决办法，就是在wxml文件中通过小程序自身的wxs语言实时分割路径字符串，比如（假定图片字段名为image）：

<wxs module="fun"> module.exports = { imgPathSplit: function(s) { if (s) return s.split(":"); } }</wxs>

然后在需要循环显示图片的地方加入代码（只是示例）：

<image wx:for="{{fun.imgPathSplit(item.image)}}" wx:key="*this" mode="aspectFill" src="{{item}}"></image>

这样，在小程序渲染页面时就会实时对路径字符串进行分割，再循环显示出图片来。

Answer 2

我想你要的是这样，而且key在微信中并不表示下标，可以看下开发文档