微信小程序-----input数据双向绑定

简介:

这里介绍两种获取的方式:

1、用户每输入一个字节就获取一个字节

2、用户全部输入结束了之后,再一起获取整个input输入框的值

注意:第二种方式会比较节省内存资源

第一种方式:

原理:我们使用bindinput事件来获取input的输入值,然后根据dataset获取要跟 data数组里的对象进行数据绑定。

wxml:

html 复制代码
<input type="text" value="{{mobile}}" bindinput='adInputChange' placeholder="手机号"/>

js

javascript 复制代码
data: {
    mobile:''
  },  
adInputChange(e){    //e  就是wxml中的value
    this.setData({
      mobile: e.detail.value,
    })

效果图

第二种方式:

相关推荐
人工智能的苟富贵1 小时前
微信小程序中的实时通讯:TCP/UDP 协议实现详解
tcp/ip·微信小程序·udp
李宥小哥2 小时前
微信小程序04-常用API上
微信小程序·小程序·notepad++
程序员阿龙2 小时前
计算机毕业设计之:教学平台微信小程序(
微信小程序·小程序·课程设计·在线教育·教育管理系统·个性化教学·学习进度跟踪
Jiaberrr2 小时前
教你如何在微信小程序中轻松实现人脸识别功能
javascript·微信小程序·小程序·人脸识别·百度ai
说私域3 小时前
开源 AI 智能名片 S2B2C 商城小程序与正能量融入对社群归属感的影响
人工智能·小程序
qq_233859437 小时前
微信getUserProfile不弹出授权框
微信·微信小程序
I592O92978311 小时前
CRM客户关系管理系统开发源码小程序
小程序
Jiaberrr15 小时前
前端实战:使用JS和Canvas实现运算图形验证码(uniapp、微信小程序同样可用)
前端·javascript·vue.js·微信小程序·uni-app
h1771134720516 小时前
单身狗的逆袭之路之开发相亲交友系统
微信小程序·小程序·交友·系统开发·回归算法
工业互联网专业17 小时前
毕业设计选题:基于springboot+vue+uniapp的驾校报名小程序
vue.js·spring boot·小程序·uni-app·毕业设计·源码·课程设计