目录
1.自定义子组件的配置
2. 自定义子组件生命周期函数
3.父子组件传值
3.1 父传子
3.2 子传父
1.自定义子组件的配置
- 在components文件中可以创建子组件，首先需要创建一个文件夹，然后右击文件夹选择新建Component 选择这个配置系统不会自动配置路由，选择新建Page是会生成路由的。
- 在子组件的js文件中有一个Component 组件实例，用于创建组件实例对象，需要注意和Page实例对象进行区分。
-
properties是组件的属性列表:类似于vue的props，用于接收父组件的props传值
properties: {// 可以简写，也可以通过对象格式来进行编写。age: Number,min: {// 约定值的类型，可以 约定一个，也可以约定一组类型type: String,// 定义初始值value: "0",},max: {type: [String, Number],value: "2",},}, -
data组件的初始:组件自身的响应式数据，和Page中data用法是一样的。
data: {}, -
methods是组件的方法列表
methods: {},在使用子组件时我们需要在对应的.json文件先进行导入子组件的操作，然后再页面上输入子组件的标签进行使用。
{"usingComponents": {"custom-grid": "../../components/grid/grid"},"navigationBarTitleText": "这里是分类页面","onReachBottomDistance": 50 }<custom-grid></custom-grid>
2. 自定义子组件生命周期函数
(1)created
created类似于vue中的beforeCreate，相同点都是组件实例this刚刚被创建，此时组件的响应式数据及方法都还没有挂载到this上。在组件实例刚刚被创建时执行，注意此时不能调用setData
created() {},(2)arrached
在组件实例刚刚进入页面节点树时执行，类似于vue的created，此时组件的响应式数据及方法都已经挂载到this上，可以发送初始化请求了。
arrached() {},(3)ready
在组件布局完成后执行，类似于vue的mounted，此时组件初始挂载完毕，组件创建阶段的生命周期结束了。
ready() {},(4)detached
组件卸载时的生命周期
detached() {},以上四种是老版本的子组件声明周期，在新版本中也可以使用，但是更推荐使用lifetimes来编写子组件的生命周期。注意：lifetimes仅支持2.2.3版本基础库以上的新写法（我们可以在详情中的本地设置看到调试基础库的版本）。
lifetimes: {// 2.2.3版本基础库以上的新写法（我们可以在详情中的本地设置看到调试基础库的版本）attached: function () {// 在组件实例进入页面节点树时执行},datached: function () {// 在组件实例被从页面节点数移除时执行},},我们也可以通过子组件来控制父组件的生命周期，比如当父组件显示时子组件执行什么操作，或者当父组件隐藏时子组件执行什么操作
// 父组件的生命周期pageLifetimes: {show() {},hide() {},},3.父子组件传值
3.1 父传子
在父组件中直接在子组件对应标签内部进行传值，需要注意的是如果传递参数是一个变量则需要在变量外加双大括号，如果是传递一个数字类型或者是布尔类型，则不需要可以加双大括号，小程序会自动识别你在子组件中需要的数据类型，然后自动进行类型转换（将纯数字的字符串转换为数字，将’true‘或’false‘自动识别为布尔值）。
<custom-grid age='100' min='text' max='abc' bind:setCount="getCount"></custom-grid>在子组件我们需要在通过properties来接受父组件传递过来的值。
properties: {// 可以简写，也可以通过对象格式来进行编写。age: Number,min: {// 约定值的类型，可以 约定一个，也可以约定一组类型type: String,// 定义初始值value: "0",},max: {type: [String, Number],value: "2",},},3.2 子传父
小程序实现子组件向父组件传值的原理是和vue是一样的，都需要通过自定义事件来完成，在小程序中自定义事件是通过bind:事件名="触发方法名"来实现的。
实现子组件向父组件传值首先我们需要在父组件设置自定义事件，然后在子组件中绑定一个点击事件，通过触发子组件的绑定事件然后通过 this.triggerEvent来调用父组件的自定义事件。
父组件：
<custom-grid age='100' min='text' max='abc' bind:setCount="getCount"></custom-grid>我们从子组件传过来的是一个对象，通过e.datail才能取到里面的数据。
getCount(e) {console.log("---", e);this.setData({count: e.detail,});},子组件：
<button bind:tap="go">发射事件</button>
methods: {go() {this.triggerEvent("setCount", 1000);},},
)
