Day13--商品列表-把商品Item项封装为自定义组件

1. 把商品 item 项封装为自定义组件

Day13--商品列表-把商品Item项封装为自定义组件_第1张图片

我的操作:

1》在 uni_modules 目录上鼠标右键,选择 新建组件: 

 Day13--商品列表-把商品Item项封装为自定义组件_第2张图片

2》将 goods_list 页面中,关于商品 item 项相关的 UI 结构、样式、data 数据,封装到 my-goods 组件中:

①把原本写在goods_list的UI结构、样式、data中的默认图片放置新的组件my-goods里面:

Day13--商品列表-把商品Item项封装为自定义组件_第3张图片

②:在goods_list里面编写代码:

Day13--商品列表-把商品Item项封装为自定义组件_第4张图片

最终效果图:【还是与之前的一模一样】

Day13--商品列表-把商品Item项封装为自定义组件_第5张图片

所以我再想封装组件的意义是之后可能在其他地方也用的上。之后也传递数据进去就行了。

和my-search的背景颜色应该是差不多的。

你可能感兴趣的:(小程序,微信,小程序,微信小程序)