小程序component组件封装及通信

* 组件封装及使用

1、项目目录下新建components文件夹然后再新建目录，里面新建组件，如图：

* 组件使用

1、在要使用得页面需先进行注册，这里在json文件里注册

"usingComponents": {
    "mine-item": "/components/shopitem/shopitem"
  },

2.页面文件使用

  <mine-item></mine-item>

* 组件通信

1.使用自定义属性名进行传递

//这里定义obj自定义属性名
<mine-item wx:for="{{List}}" obj="{{item}}" wx:key="desc"></mine-item>

2.组件js里，定义接收类型

//接受外部传入得属性及值
  properties: {
    obj: {
      type: Object,
      value: {}
    }
  },

3.页面使用传递下来得值，即可

<view style="height: 200rpx;background-color: bisque;margin-bottom: 10rpx;">
  {{obj.desc}} 
  {{obj.price}}
</view>