小程序父子组件传值

首先子组件必须是自定义的组件.不能是page里边创建的页面.
父向子传值
父组件代码

<view>
<!-- 这里是父组件的wxml文件代码 -->
<com1 msgAtoB="{{msgAtoB}}" ></com1>
<!--msgAtoB将父组件信息传给子组件 -->
</view>

这里是父组件的json文件代码

{
  "component": true,
  "usingComponents":{
    "com1":"../../components/child2/child2"
这里要设置子组件的标签名和子组件的相对路径(复制代码后将此行删除,json文件不能有注释)
  }
}

这里是父组件的js文件代码

Page({
  data: {
    msgAtoB: "这是父向子传递的信息",
  },
  hahaha:function(e){
    this.setData({
      msgBtoA: e.detail.msgBtoA
    })
  }
})

这里是子组件的wxml文件代码

<view>
{{msgAtoB}}
</view>

这里是子组件的js文件代码

Component({
  properties:{
    msgAtoB:{
      type:String//设置父组件的数据格式
    }
  }
})

子向父传值
父组件wxml代码

<view>
<!-- 这里是父组件的wxml文件代码 -->
<com1 msgAtoB="{{msgAtoB}}" bind:myevent="hahaha"></com1>
<!--msgAtoB将父组件信息传给子组件 ,bind:myevent通过事件绑定来接收子组件的消息 -->
{{msgBtoA}}
</view>

这里是父组件的json文件代码和之前一样,无改动

这里是父组件的js文件代码

Page({

  /**
   * 页面的初始数据
   */
  data: {
    msgAtoB: "这是父向子传递的信息",
    msgBtoA:"这里接收儿子的信息"
  },
  hahaha:function(e){
    this.setData({
      msgBtoA: e.detail.msgBtoA
    })
  },
})

这里是子组件的wxml文件代码

<view>
{{msgAtoB}}
<button bindtap='send'>按钮</button>
{{msgBtoA}}
</view>

这里是子组件的js文件代码

Component({
  properties:{
    msgAtoB:{
      type:String//设置父组件的数据格式
    }
  },
  data:{},
  methods:{
    send:function(){
      this.triggerEvent("myevent", { msgBtoA:"儿子的信息传过来了"})
    }
  },

})