小程序中子组件父/组件互相传值以及互相接收

版权声明:菜鸟老五 https://blog.csdn.net/qq_35695041/article/details/84025301
//show_none 组件遮罩属性[true-false]  
//compontpass子组件传值父组件接收 
//modal-d 父组件传值子组件接收
//pract_moules_id 父组件页面中点击按钮传值给子组件
//modal-msg内容
//组件



//A页面引入组件 A.WXML
<pract modal-hidden="{{show_none}}" bind:compontpass="compontpass" modal-d="1" id="start_id" modal-msg="{{modalMsg}}" />
<view bindtap="btn_start">A页面</view>
//A页面 A.JSON
{
  "navigationBarTitleText": "A页面引入组件",
  "usingComponents": {
      "componts": "../../../components/componts/componts"
  }
}
//A.js
Page({
  /**
   * 页面的初始数据
   */
  data: {

  },
  //父组件接收子组件传值
  compontpass:function(res){
  if(e.detail.val){}
  console.log(e.detail.val);
  
  
  },
  //点击传值给子组件
btn_start:function(){
      // 点击父组件传值给子组件
        var start_id = that.selectComponent("#start_id");
        start_id.btn_start(1);

}

})


//组件
//B页面--组件  B.WXML
<view>B组件</view>
//B页面--组件  B.JSON
{
  "component": true
}


//B页面 B.js

var app=new getApp();
Component({
  properties: {

    //这里是遮罩层----默认显示
    modalHidden: {
      type: Boolean,
      value: true
    },
    modalD: {
      type: String,
      value: ""
    },
    // 文本内容
    modalMsg: {
      type: String,
      value: " "
    },
  },
  data: {
    // 这里是一些组件内部数据
    context: "默认内容",

  },

  // 子组件初始化加载方法
  attached: function() {
    //
    if (this.data.modalD == 1) {
      this.setData({
        context: "子组件初始化加载中获取到父组件值--modal-d"
      })
    }
   

  },

  // 这里是所有方法
  methods: {

    // 子组件接收父组件点击事件传过来的值
    btn_start: function(obj) {
      console.log("子组件接收到的值", obj);
      if (obj == 2) {
        this.setData({
          context: "子组件接收到父组件页面点击事件传过来的值"
        })
      }
	  

	  //子组件传值给父组件
	  
	var val = this.data.context; //通过这个传递数据
      var myEventDetail = {
        val: val
      } // detail对象,提供给事件监听函数
      this.triggerEvent('compontpass', myEventDetail) //myevent自定义名称事件,父组件中使用
	  
	  
	  
    },


    }



  },







})

猜你喜欢

转载自blog.csdn.net/qq_35695041/article/details/84025301