微信小程序自定义组件

微信小程序自定义组件

1. 自定义组件-组件的创建和引用
2. 自定义组件-样式
3. 自定义组件-数据，方法，属性
4. 自定义组件-数据监听器
5. 自定义组件-纯数据字段
6. 自定义组件-组件的生命周期
7. 自定义组件-插槽
8. 自定义组件-父子组件通信
9. 自定义组件-behaviors
10. 总结

1.自定义组件-组件的创建和引用

组件创建：
1.在小程序项目 根目录 新建 components 文件夹
2.在 components 文件夹中创建文件夹 自定义名
3.右击新建的文件 选择 Component 即创建出 js，json，wxml，wxss 四个文件

组件使用（局部和全局）

1. 在 .json 文件中引用组件，组件引用格式：

   "usingComponents": {
        
   	"引用后的名字": "组件路径"
   }
   

局部使用：
只在当前页面使用自定义组件，在其他页面中引入不起作用

1. 在要使用组件页面的json文件中进行配置
2. 在要使用组件页面的wxml文件中引入
   

全局使用：
可在每个页面中使用自定义组件

1. 在全局文件app.json文件中配置
2. 在任意小程序中页面的wxml文件中引用都可以使用组件
   

2.自定义组件-样式

h-arrow 是一个自定义组件， 尝试直接添加class属性

解决方案：
组件的js

引入组件：
组件的 wxml

组件的 wxss

3.自定义组件-数据，方法，属性

1.data数据
在小程序组件中，用于组件模板渲染的私有数据，需要定义到 data 节点中，示例如下：

2.methods 方法
在小程序组件中，事件处理函数和自定义方法需要定义到 methods 节点中，示例代码如下：

3.properties 属性
在小程序组件中，properties 是组件的对外属性&#