微信小程序-点击事件、text标签赋值

点击事件

  • 设置(bindtap)和监听
html 复制代码
<button class="key" bindtap="keyClick" data-value="1">1</button>
javascript 复制代码
Page({
  keyClick: function (e) {
    const value = e.currentTarget.dataset.value;
  },
})

text标签赋值

在微信小程序中,要给指定的<text>标签设置值,可以通过以下步骤实现:

  • 获取<text>标签的ID:首先确保你的<text>标签具有唯一的ID属性。
html 复制代码
<text id="myText">默认文本</text>
  • 设置<text>标签的值:在微信小程序中,不能直接修改<text>标签的文本内容。你需要使用数据绑定的方式来实现。首先,在Page的data对象中定义一个变量,例如myTextValue。
javascript 复制代码
Page({
  data: {
    myTextValue: '默认文本',
  },
  // ...
});
  • 然后,在<text>标签中使用{``{}}将变量绑定到<text>标签的文本内容。
html 复制代码
<text>{{myTextValue}}</text>
  • 修改<text>标签的值:在需要修改<text>标签的文本内容时,只需修改data对象中的myTextValue变量即可。
javascript 复制代码
this.setData({
    myTextValue: '新的文本内容',
});

//点击事件中动态修改

keyClick: function (e) {
    const value = e.currentTarget.dataset.value;
    this.setData({
      input: this.data.myTextValue + value
    });
}
相关推荐
酷爱码5 分钟前
旅游计划定制小程序网页模板源码
小程序·旅游
努力学习的木子6 小时前
uniapp如何隐藏默认的页面头部导航栏,uniapp开发小程序如何隐藏默认的页面头部导航栏
前端·小程序·uni-app
guanpinkeji12 小时前
家政小程序的开发,带动市场快速发展,提高家政服务质量
小程序·小程序开发·家政·家政小程序·家政服务小程序
Cc_Debugger12 小时前
微信小程序消息通知(一次订阅)
微信小程序·小程序
joan_8516 小时前
微信小程序利用第三方库xlsx导出excel
微信小程序·excel
栗豆包18 小时前
【计算机毕业设计】020基于weixin小程序订餐系统
小程序·课程设计
2401_8459364518 小时前
PHP智慧门店微信小程序系统源码
微信·微信小程序·小程序·微信公众平台·微信开放平台
井眼19 小时前
微信小程序-组件样式隔离
微信小程序·小程序
社会底层无业大学生1 天前
uniapp微信小程序电子签名
微信小程序·小程序·uni-app
梦夏夜2 天前
微信小程序订单发货管理接入
微信小程序·小程序·发货信息管理