微信小程序原生学习笔记—组件(1)

1.组件的创建与使用:

（1）根目录创建components文件夹存放组件，并在里面创建一个组件文件夹。

 （2）在组件文件夹里添加组件模板，编写组件的代码

 （3）引用组件，在父组件的json文件中的usingComponents中添加子组件路径。

（4）在wxml文件中使用组件。

2.组件事件与事件的处理

（1）子组件中添加点击事件。

（2）通过this.triggerEvent("自定义事件名称",{传的值})向父组件抛出点击事件。

（3）父组件绑定子组件，定义方法接收子组件传递的参数

3.组件的properties属性

properties 可以作为组件的参数接收外部传递进来的值。

（1）在组件 JS 文件中，Component 内添加 properties 字段。并给每一个 properties 字段添加一个 type 属性，指定数据类型。（value属性非必选）

（2）注意事项：字段名称必须采用驼峰命名法，组件传递值时必须采用短横线命名法，也就是说 itemType 对应 item-type。

（3）使用组件，传递值

（4）observer属性，监听属性值的变化主动调用

 注意事项：不要在observer中修改自身属性值，否则会无限递归调用，导致内存泄漏！

4.Slot组件插槽

        slot 允许在使用组件时插入更多的内容。简单来讲，就是在组件内预设一个位置，使用组件时插入更多的内容到组件内。这些附加的内容位置取决于 slot 在组件内的预设位置。实际上，slot 就是组件的内容占位符。

（1）在组件中添加 slot 标签，预设后期使用组件时内容显示在组件的具体位置

 （2）使用组件时，在组件中插入附加的内容

（3）在组件的JS文件中启用slot