微信小程序组件嵌套组件传值问题
思考
- 我们在主页面使用了
panel组件，而panel组件内部使用了tabBar组件，这时候我们应该如何正确的传递数据给tabBar组件呢？ - 其实也很简单，就是
主页面传值给panel组件，panel组件在传值给tabBar组件，这样就间接实现了主页面给tabBar组件传值。
主页面使用panel组件
注册组件到页面
注册定义组件json
{
"usingComponents": {
"panel" :"/compontents/panel/panel"
}
}主页面初始化数据
...
data: {
items:[
{id:1,name:"测试"},
{id:2,name:"测试1"}
]
}
...主页面调用panel组件wxml并传值
<panel panelItem="{{items}}"/>组件panel
组件所在目录位置
在组件panel的js文件中定义接受的值,其中type为类型,value为默认值
...
properties: {
panelItem:{
type:Array,
value:[]
}
},
...组件wxml
<view>
...
<tabBar tabBarItem="{{panelItem}}"
...
</view>组件tarBar
组件所在目录位置
在组件tarBar的js文件中定义接受的值,其中type为类型,value为默认值
...
properties: {
tabBarItem:{
type:Array,
value:[]
}
},
...组件wxml
<block x:for="{{tabBarItem}}" wx:key="index">
<view>{{item.id}}<view>
<view>{{item.name}}<view>
</block>本文参与 腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
目录