小程序组件化之Component/template

做过移动开发的同学都知道，现在都讲究组件化。
别急，小程序里也有组件这个概念，有两种实现方式，一种是模板（template），一种是自定义组件component。
一般自定义组件就是右键点击新建component，小程序ide会自动生成四个文件，分别是
1.xx.json
该文件主要是配置文件，可以添加自己引用到的其他组件，只需要在usingComponents属性后面添加就行，注意引用时注意组件的路径。

  "usingComponents": {
	}

2.xx.wxml
页面文件，其实就是常规的html文件
3.xx.wxss
css文件，用来写样式
4.xx.js
该js文件负责数据的注入，以及事件的绑定

重点内容
properties：
该属性主要负责数据的注入

	   /**
	   * 组件的属性列表
	   */
	  properties: {
	    data: {
	      type: Object,
	      value: {
	
	      }
	    }
	  }

上面的data属性对应你引用组件里的属性，data = {{ 数据源}}

data：{

}

负责数据的初始化，以及数据的驱动来更新页面

methods：{

}

该属性主要对应xml里绑定的点击事件，组件事件的冒泡处理也在这里,即：组件里的点击事件，要到最外层处理，因为数据肯定实在最外层的页面js中，这个时候就要用到组件

 _xx: function (e) {
      this.triggerEvent("xxEvent', {}, { bubbles: true, composed: true })
    }

template

template很简单，

<template name="xx">
  <view class="">
   
  </view>
</template>

引用时通过
<template is="xx"  />即可