目的
将js文件中从服务器中获取的数据,在wxml的文件中以数组循环的形式插入展示到前端页面。
通俗点的解释就是通过wx:for循环一个数组,实现小程序wxml文件内的标签循环,插入数组的数据到循环的标签中。
实现
js代码,要有相关数组数据
// js
Page({
/**
* 页面的初始数据
*/
data: {
theList: [
{text: "爱情神话",src:"/image/new1.jpg"},
{text: "记忆 Memoria",src:"/image/new2.jpg"},
{text: "世界上最糟糕的人",src:"/image/new3.jpg"},
{text: "希尔达与山丘之王",src:"/image/new4.jpg"},
{text: "呼朋引伴",src:"/image/new5.jpg"},
{text: "此时此爱 Ensilumi",src:"/image/new6.jpg"}
]
},
})
wxml代码,花括号里的是全局变量
<!-- wxml -->
<view wx:for="{{theList}}">
<image src="{{item.src}}"></image>
<text>{{item.text}}</text>
</view>