微信小程序父传子,子传父

195 阅读1分钟

父传子:

json文件:声明子组件

{
  "usingComponents": {
    "tem-baomingtan": "/components/baomingtan/baomingtan"
  }
}

页面中使用子组件:在父组件上传值给子组件

立即报名

js文件:点击修改数据

data: {
	isinfotan: false
},
lijibm: function () {
    this.setData({
      isinfotan: true
    })
  }

子组件:

<view class="infoboxtan" wx:if="{{isinfotan}}">
	<image src="../../images/close-xx.png" mode="widthFix" class="close" bindtap="closeinfo" />
	<!-- ... -->
</view>

子传父:

js: properties 接收父组件传来的值,点击关闭事件closeinfo(),加一个触发事件infotan,传值给父组件;

  properties: {
    isinfotan: Boolean
  },
  methods: {
	  closeinfo:function() {
	    this.triggerEvent('infotan', {
	      isinfotan: false
	    });
	  }
  }

父组件页面中接收子组件的触发事件:

立即报名 1 2 父js: infotan获取子组件传来的值;

data: {
	isinfotan: false
},
  lijibm: function () {
    this.setData({
      isinfotan: true
    })
  },
  infotan: function (e) {
    this.setData({
      isinfotan: e.detail.isinfotan
    })
  },