小程序组件化开发

创建-注册-使用

一样需要四个文件
哪个组件需要用，就得在自己的json文件注册


注册完以后既可以用

这是组件必须有的，证明是组件。

细节

命名要规范，可以嵌套调用组件



也可以全局配置，这样每个页面都可以引用组件

组件的样式细节

标签选择器会影响外部。外部用标签选择器也会影响内部

所有用class最好。


页面的js中的对象是pages(),APP.js中的对象是APP(),而组件中的对象则是conponent，
apply-shared是默认，外部影响内部，而内部不能影响外部

没有影响，
外部影响了。
当值为shared时，就可以互相影响。

组件页面通信

传数据。
1 在组件的js里面，value是默认值


2传

3展示

结果



监听值改变，第一次从默认值变成哈哈哈，第二次从哈哈哈变成嘿嘿嘿。

传样式

1定义

在组件内定义好，做好接受的准备
2 传

在引用组件是顺便传过去，但传过去这个可以看成是传一个类过去，而这个类需要在自己的wxss里面定义。！！！
相当于他自己定义好这个类，再把这个类传过去，而组件只需要做好接接受的准备即可。

组件向外传递事件

这个事件还是跟vue里面的差不多，其他两个页面的事件都是直接放在外面，而组件的事件需要放在methods里面，
1 首先。在组件里面监听

2 监听到后在组件的js文件里处理这个事件，

this.triggerEvent是发送事件，第一个是发送的事件名称，第二个是参数。vue中子组件发送事件是。
this.$emit(‘事件名称’，传递的值。)
3 发送出去后，在引入组件时顺便用bind:监听，vue里是用@监听，监听到后在作出处理

4 作出处理，在自己的js文件中处理监听到的子组件发出来的事件。

传过来的值放在event的detail里面

页面直接调用组件的方法

this.selectComponent()就可以访问组件里面的方式

页面的方法修改组建的数据

在页面的点击事件直接修改组建的数据，记得要用setData,不然不能达到响应式效果。
但这种方法不可取，最好不要在页面直接修改数据。在组件创建一个方式修改数据，页面直接调用就好

效果是一样的。