微信小程序——wepy框架下的数据绑定

本文介绍了一个小程序中视频列表的展示代码,使用了WXML进行布局设计,包括视频封面、播放按钮、标题、点赞数等元素,并通过data数据绑定实现动态显示。

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

代码部分:

<view class="m-list">
      <view class="list-item" wx:if="{{show}}">
        <image class="item-video" @tap="videoDet" src="{{item.image}}">
          <image class="v-btn" src="{{item.play}}"></image>
        </image>
        <view class="item-tit"><text>{{item.message}}</text></view>
        <view class="item-info">
          <view class="info zan">
            <image src="{{item.zan.image}}"></image>
            <text>{{item.zan.number}}</text>
          </view>
        </view>
      </view>
</view>
data = {
      show: true,
      item:{
        image:'../assets/images/bg.png',
        play:'../assets/images/play.png',
        message:'你与温柔',
        zan:{
          image:'../assets/images/zan.png',
          number:1821
        }
      }
}

效果:

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值