微信小程序template嵌套template,怎么传递数据

template是一个很方便的复用性强的模块,一个稍微复杂的界面可能由多个template构成,有时候也需要template嵌套template去达到想要的效果,那么template嵌套之间怎么传递数据呢?

<template name="postItem">
  <view class='post-container'>
    <view class='post-author-date'>
      <image class='post-author' src='{{avatar}}'></image>
      <text class='post-date'>{{date}}</text>
    </view>
    <text class='post-title'>{{title}}</text>
    <image class='post-image' src='{{imgSrc}}'></image>
    <text class='post-content'>{{content}}</text>
    <template is='postLike' data='{{reading,collection}}'/>
  </view>
</template>
<template name="postLike">
  <view class='post-like'>
    <image class='post-like-image' src='/images/icon/chat.png'></image>
    <text class='post-like-font'>{{reading}}</text>
    <image class='post-like-image' src='/images/icon/view.png'></image>
    <text class='post-like-font'>{{collection}}</text>
  </view>
</template>

就像代码中

<template is='postLike' data='{{reading,collection}}'/>

所示,我们需要把从这个界面传递到嵌套界面的数据通过data的方式传递过去,这样传递的那个界面的数据就能接收到

 <block wx:for='{{posts_key}}' wx:for-item='item'>
    <!-- ...将数据平铺,这样直接在wxml中引用属性就能取到值 -->
    <view catch:tap='onPostTap' data-postId='{{item.postId}}'>
      <template is='postItem' data='{{...item}}' />
    </view>
  </block>

这是调用数据的那个代码(我是一只菜鸟,勿喷)


评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值