微信小程序学习日记---数据绑定,列表渲染,条件渲染

最新推荐文章于 2021-02-04 23:43:01 发布

爱憎分明丶

最新推荐文章于 2021-02-04 23:43:01 发布

阅读量329

点赞数 1

CC 4.0 BY-SA版权

分类专栏：微信小程序学习日记

本文链接：https://blog.youkuaiyun.com/qq_39734584/article/details/88048965

微信小程序学习日记专栏收录该内容

11 篇文章

订阅专栏

本文展示了一个小程序页面的交互设计，包括按钮触发的名称更改和条件渲染。通过使用wx:for实现列表循环显示，以及wx:if、wx:elif、wx:else进行条件判断，实现了动态页面内容的展示。

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

//demo.js

Page({

  /**
   * 页面的初始数据
   */
  data: {
    name:'爱憎分明',
    list:[1,2,3,4,5],
    result:'none',
  },
)
//demo.wxml
<text>pages/demo/demo.wxml</text>
<view>
  <text>{{name}}</text>
  <view id='changeName' bindtap='changeName'>改变Name</view>
  <view id='sayHello' bindtap='sayHello'>say Hello</view>
  <view wx:for="{{list}}">{{item}}</view>
  <view wx:if="{{result=='wx'}}">wx</view>
  <view wx:elif="{{result=='zfb'}}">zfb</view>
  <view wx:else="{{result=='none'}}">none</view>
</view>