微信小程序——父传子

(本篇前提,已经将子组件在父组件中通过标签的形式展示出来)

在父组件的操作

在父组件的 js 文件的 data 中,随便定义一个数组,对象,或数组对象,举例:

data: {
        dadlist:["苹果","榴莲","芒果"]
    }

在父组件的 wxml 文件中,随便定义一个名字去接收这个数据,举例:

(这里的lists是子组件)

<lists daddata="{{dadlist}}"></lists>

在子组件的操作

在子组件的 js 文件中,通过 properties 来接收数据,properties 和 data 同级,举例:

(后边的 Array 是数据的类型)

properties: {
        daddata:Array
    }

觉得太简单,想多一点,可以这样写,举例:

properties: {
    // 以数组对象举例,显的多
    lists:{
      type:Array,
      value:[
        {
          id:88,
          name:'默认的值'
        }
      ]
    }
  }

然后,就可以在子组件中进行渲染数据了,举例:

<view wx:for="{{daddata}}" wx:key="*this">
    {{item}}--这是儿子从父亲那里接收过来的数据
</view>

页面效果

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值