uni-app基于vue的写法，列表渲染，循环嵌套数组v-for，也可用于vue。循环嵌套循环的方法

 页面html部分

	{{item.liTitle}}
	
	    
	    	
	    		
	    		{{itemson.utitle}}
	    		
	    			￥{{itemson.price}}
	    			
	    			
	    		
	    	
	    
	

页面数据部分

data() {
		return {
			shopList: [
				{
					liTitle: "热门推荐",
					shopingList: [
						{
							navigator: "#",
							image: "background-image: url(/static/img/shop/img001.jpg);",
							utitle: "进口儿童牛奶",
							price: "39.90",
							icon: "/../static/img/gc.png"
						},
						{
							navigator: "#",
							image: "background-image: url(/static/img/shop/img002.jpg);",
							utitle: "进口儿童牛奶",
							price: "39.90",
							icon: "/../static/img/gc.png"
						},
						{
							navigator: "#",
							image: "background-image: url(/static/img/shop/img001.jpg);",
							utitle: "进口儿童牛奶",
							price: "39.90",
							icon: "/../static/img/gc.png"
						},
						{
							navigator: "#",
							image: "background-image: url(/static/img/shop/img002.jpg);",
							utitle: "进口儿童牛奶",
							price: "39.90",
							icon: "/../static/img/gc.png"
						}
					]
				},
				{
					liTitle: "精品套餐",
					shopingList: [
						{
							navigator: "#",
							image: "background-image: url(/static/img/shop/img001.jpg);",
							utitle: "进口儿童牛奶",
							price: "39.90",
							icon: "/../static/img/gc.png"
						},
						{
							navigator: "#",
							image: "background-image: url(/static/img/shop/img002.jpg);",
							utitle: "进口儿童牛奶",
							price: "39.90",
							icon: "/../static/img/gc.png"
						},
						{
							navigator: "#",
							image: "background-image: url(/static/img/shop/img001.jpg);",
							utitle: "进口儿童牛奶",
							price: "39.90",
							icon: "/../static/img/gc.png"
						},
						{
							navigator: "#",
							image: "background-image: url(/static/img/shop/img002.jpg);",
							utitle: "进口儿童牛奶",
							price: "39.90",
							icon: "/../static/img/gc.png"
						}
					]
				}
			]
		}
	}

这是我写的显示效果，你可以根据自己的需求去写