1、创建component组件
2、在index主页面的index.json文件里配置引入组件
3、在主页面的wxml里面直接写shoplist标签
wx:for="{{list}}"是循环已经在js文件里请求到的数据- 以下是传值（传给组件）
- characteristic="{{item.name || item.characteristic}}"
pic="{{item.pic}}" minPrice="{{item.minPrice}}"originalPrice="{{item.originalPrice}}"
<view class="mains"> <shoplist class="shop" wx:for="{{list}}"characteristic="{{item.name || item.characteristic}}"pic="{{item.pic}}"minPrice="{{item.minPrice}}"originalPrice="{{item.originalPrice}}" /> </view>
4、在组件的js里接收值并定义类型
properties: { characteristic:{ type:String,//类型 value:'男童风衣'，//默认值 }, pic:{ type:String, value:'https://cdn.it120.cc/apifactory/2019/06/25/a0edbee6-44c2-453f-9398-01edfb355323.jpg' }, minPrice:{ type:String, value:'700' }, originalPrice:{ type:String, value:'900' } },
5、在组件的wxml里直接写
<image src="{{pic}}"class="image"></image> <view class="title"style="font-weight:800">{{characteristic}}</view> <view class="pirce"> <view style="color:red">￥{{minPrice}}</view> <view style="clor:gray; text-decoration:line-through;">￥{{originalPrice}}</view> </view>
