微信小程序-点击事件、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
    });
}
相关推荐
2501_915918419 小时前
苹果App Store上架审核卡住原因分析与解决方案指南
android·ios·小程序·https·uni-app·iphone·webview
用户7009807357314 小时前
从零开发一个微信记账小程序,零依赖、附完整源码
微信小程序
焦糖玛奇朵婷17 小时前
盲盒小程序开发|解锁开箱新体验[特殊字符]
大数据·开发语言·程序人生·小程序·软件需求
左师佑图18 小时前
微信小程序组件事件冒泡问题排查与解决方案
微信小程序·小程序
树下水月19 小时前
微信小程序接口,必须使用https的443端口吗?
微信小程序·小程序·https
毕设源码-邱学长19 小时前
【开题答辩全过程】以 灵山水牛奶配送小程序的设计与实现为例,包含答辩的问题和答案
小程序
2501_9159184119 小时前
基于Mach-O文件的动态库与静态库归属方案及API扫描实践
android·ios·小程序·https·uni-app·iphone·webview
2501_9151063219 小时前
iOS 证书无法跨电脑使用?签名迁移方法一文讲透
android·ios·小程序·https·uni-app·iphone·webview
毕设源码-赖学姐20 小时前
【开题答辩全过程】以 基于springboot的酒店预订小程序自动化订制系统为例,包含答辩的问题和答案
运维·小程序·自动化
CHU72903520 小时前
邻里同心,便捷团购——社区团购商城小程序前端功能版块解析
前端·小程序