微信小程序中实现父子传值

小程序搁置了一段时间着实忘记了挺多。今天覆习的是父子传值。欢迎随时补充!!!

父组件给子组件传值

  • 第一步:定义父组件 在父组件json 中引入子组件
{
  "usingComponents": {
    "sonCom":"../components/add.js"
  }
}
  • 第二步:在子组件中给自己定义成一个子组件
{
  "usingComponents": {
    "sonCom":"../components/add.js"
  }
}
  • 第三步:在父组件中,子组件的引用处,绑定一个属性( text ),并传递想要给子组件的值( sonData )

<son text={{sonData}}></son>

第四步:在父组件的js文件中data来定义

   */
  data: {
    sonData: [{
        title: "热点",
        content: "罗志祥周扬青分手"
      },
      {
        title: "新闻",
        content: "全球确诊病例达到两百万"
      }
    ]

  },

第五步:子组件中来接受一个数据类型

  // 我们在子组件的这个properties里面写上我们在子组件标签定义的那个属性名来接收 一个数据加一个类型默认是value这样的话就完成了父传子
  properties: {
    data: {
      value: "",
      type: String
    }
  },

子传父

  • 第一步: 子组件在需要传值时,使用trriggerEvent传给父组件一个事件( myevent ),并传递想要给父组件的值( sonParam)
    this.triggerEvent('myevent',{sonParam:false})

  • 第二步:在父组件中,子组件的引用处,通过这个myevent事件绑定一个方法( onMyEvent )
<son bind:myevent="onMyEvent"></son>
  • 第三步: 在父组件的js中,定义这个方法onMyEvent,在这个方法内就可以获取到子组件传递过来的值了
  onMyEvent:function(e){
      let a =e.details.sonPmaram
    }

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章