微信小程序的父子组件传值

本文介绍了微信小程序中父子组件的传值方法。包括父组件如何通过属性将数据传递给子组件,子组件如何使用this.triggerEvent方法向父组件传递数据,并详细说明了触发事件时的参数含义和在父组件中接收数据的方式。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

微信小程序的父子组件传值

如果小程序中有可复用的UI且具有一定的功能性,就可以使用自定义组件将其封装起来。

下面介绍父子组件的数据传递方法,以及一个简单的组件和一个复杂的组件示例。

 

二、父子组件传递数据的方法

1.父组件向子组件传递数据

parent.wxml

<my-component name="{
  
  {name}}" age="{
  
  {age}}"></my-component>

parent.js

 

data: {
  name: 'Peggy',
  age: 25
}

 child.js

properties: {
  name: {
    type: String,
    value: '小明'
  },
  age: Number
}

父组件向子组件传值以属性的形式,子组件以properties接收,并可指定数据类型type以及默认值value。
在wxml里可直接以{ {name}}的形式使用,而在js中以thi

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

慕容屠苏

你的鼓励是我最大的动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值