VUE(uni-app框架)开发微信小程序②-for循环

数组类型在uni-app中属于一个比较常见的类型,可是想将数组中的数据展现出来就需要借助循环,今天来认识一下【v-for】循环

先新规一个数组

//数组
list:[
	{
	 id:0,
	 text:"香蕉",
	 price:30

	},
	 {
	 id:1,
	 text:"葡萄",
	 price:40
	 },
	 {
	 id:2,
	 text:"橙子",
	 price:20
	 }
]

再用v-for循环展示出来(index就是索引,list指上文定义的数组,key指唯一变量)


	   名称:{{item.text}}  ||  价格:{{item.price}}元/公斤

整体代码如下:





展示效果如下:

VUE(uni-app框架)开发微信小程序②-for循环_第1张图片

你可能感兴趣的:(微信小程序,学习,vue.js)