微信小程序自定义组件----父子组件间通信

微信小程序自定义组件----父子组件间通信

自定义组件有非常高的灵活行，就算不能提出优秀的公共组件，自定义组件也有它的用处，减小单文件代码体积，后期维护项目也特别方便，而平时开发中用的最多的还是父子组件间的通信，今天有时间就整理一下。

父传子

父组件 向 子组件 传递数据通过标签属性的方式来传递

1.子组件

	这里是我自己二次封装的一个loading组件，先在components下新建一个文件名叫myloading，文件同名

1-1 myloading.json

	 json文件，一定要注意，组件json文件中的component必须为true，这点和普通页面不同。

1-2 myloading.js

      js文件，最外层是component包裹不是page包裹，properties包裹的是组件的属性列表，我的理解就是相当于Vue框架的props属性，用来接收父组件传过来的值

1-3 wxml文件就是你的html要写的东西
1-4 wxss文件写自己想要的样式

2.父组件

2-1.json文件，注册组件名和组件路径

 2-2wxml文件中，写上注册组件的标签，{{isShow}}就是我传过去的数据，用过vue的父子传值的对这个写法肯定会很眼熟了，是的，这就是微信的父向子的通信，这样就好了

子传父

子组件

   wxml文件中

js文件中，子组件methods中写绑定事件，这个语法用过Vue的子传父通信的同学也会特别眼熟对吧，注意，函数要写在methods中，写在外面是没有效果的，因为这是在组件中，这样我们的子组件就写好了，

父组件

wxml文件中，

 js文件写上对应函数，然后就可以在函数中写上你的功能逻辑了，对了 ，子组件传过来的数据就在e里面的detail中，这样父组件就拿到了子组件的数据了。

以上就我个人对微信小程序的父子通信的理解，如有不足欢迎评论区不足，我会一条条的看的

如果看完对你们有帮助的话，千万别吝啬你们的小星星咯！又是勤劳的一天，爱你们哟