微信小程序组件通信入门及组件生命周期函数
组件生命周期函数链接地址:https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/lifetimes.html
微信小程序中使用方法传递参数
错误写法:
父级 //传递的参数必须以data-xxx开头
1、暴露组件,在组件xxx.json里
{ "component": true, "usingComponents": {} }
2、在父级注册组件,在xxx.json里
{ "usingComponents": { "sron":"/components/sron/sron" } }
3、父组件向子组件传递参数
//transmit是来自data里面的数据
4、子组件接收参数
Component({ /** * 组件的属性列表 */ properties: { mes:{ type:String, value:'' } }, /** *在组件实例进入页面节点树时执行 */ attached(){ console.log(this.properties.mes) } })
注意:此处两个参数要相同
文章图片
1)在小程序中改变data中的状态使用 this.setData
data:{ curAdProp:{}, }, methods: { dataInit(){ this.setData({ 'curAdProp': "我要改变data里面curAdProp的数据" }); } }
5、子组件向父组件传值(通过 triggerEvent 方法)
我是子组件
//是组件---->方法需要写到methods函数里面
methods:{ btn_sron(){ this.triggerEvent("btn_box","我是传递给父级的数据")//btn_box是将要在父级触发的事件 } }
--------------------------父级中-----------------------------
//btn_sron是btn_box事件要触发的方法
//非组件----》方法不用写在methods函数里面
btn_sron(e){ console.log("来自子组件的数据",e.detail)//e.detail是来自子组件的数据 }
【微信小程序组件通信入门及组件生命周期函数】转载于:https://www.cnblogs.com/tlfe/p/11126861.html
推荐阅读
- 一个小故事,我的思考。
- 家乡的那条小河
- 一个人的碎碎念
- 野营记-第五章|野营记-第五章 讨伐梦魇兽
- 昨夜小楼听风
- 2021-02-17|2021-02-17 小儿按摩膻中穴-舒缓咳嗽
- 基于微信小程序带后端ssm接口小区物业管理平台设计
- 2019.4.18感恩日记
- 那件我们忽略的小事叫感恩
- 你有婚内虐待行为吗()