微信小程序-点击事件、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
    });
}
相关推荐
YUJIAN。1 小时前
使用uniapp开发微信小程序-框架搭建
微信小程序·小程序·uni-app
关你西红柿子3 小时前
小程序app封装公用顶部筛选区uv-drop-down
前端·javascript·vue.js·小程序·uv
V+zmm101343 小时前
基于小程序宿舍报修系统的设计与实现ssm+论文源码调试讲解
java·小程序·毕业设计·mvc·ssm
V+zmm1013410 小时前
基于微信小程序的乡村政务服务系统springboot+论文源码调试讲解
java·微信小程序·小程序·毕业设计·ssm
还这么多错误?!10 小时前
uniapp微信小程序,使用fastadmin完成一个一键获取微信手机号的功能
微信小程序·小程序·uni-app
_院长大人_10 小时前
微信小程序用户信息解密 AES/CBC/NoPadding 解密失败问题
微信小程序·小程序
web1350858863511 小时前
uniapp小程序使用webview 嵌套 vue 项目
vue.js·小程序·uni-app
guanpinkeji11 小时前
废品回收小程序:助力企业转型发展
小程序·小程序开发·小程序制作·回收·废品回收小程序·废品回收
407指导员11 小时前
uniapp 微信小程序 页面部分截图实现
微信小程序·小程序·uni-app
三木吧14 小时前
开发微信小程序的过程与心得
人工智能·微信小程序·小程序