组件通讯（小程序端）

末蓝、 2022-11-11 13:08 224阅读 0赞

小程序端：

父组件调用子组件方法：

  1.     this.**selectComponent**('\#search').listByTag();  //listByTag是子组件methods里定义的方法

父组件调用子组件属性：

  1.     let refresh =this.**selectComponent**('\#search').data.isRefresh   //isRefresh   是子组件data里定义的属性
  3. 父组件引入子组件：
  4. .json文件引入子组件
  6. {
  7.     "usingComponents": {
  8.         "search": "/components/search/search"
  9.     }
  10. }
  11. .wxml文件使用子组件
  12. <search id="search"></search>

子组件调用父组件方法：

  1. 子组件的onload写：
  2. this.triggerEvent("callSomeFun");
  4. 父组件写：
  5. <search  bind:callSomeFun="onLoad"></search>

子组件获取父组件的属性

  1. 子组件
  2.   properties: {
  3.     product: {
  4.       type: String,
  5.       value:''
  6.     }
  7.   },
  9. 父组件
  10. <search product='123'></search>

兄弟组件通信：

子组件A传值给子组件B。父组件可以先获取子组件A的值，父组件再将获取到的值传给子组件B

子组件A使用triggerEvent自定义事件名称callSomeFun。父组件在onload用 this.selectComponent(‘#search’).listByTag()获取调用子组件B方法

父组件写：

利用同一个父组件是可以达到兄弟组件的传值，但是如果有很多的值需要传递这种方式就不是特别适用(可以用缓存)

发表评论

表情：
评论列表 （有 0 条评论，224人围观）

还没有评论，来说两句吧...

相关阅读