支付宝、学习强国小程序input、textarea数据双向绑定

前言

vue 的绑定有些区别,需要注意。直接 value="{``{inputValue}}" 是无法双向绑定的。

正确思路

文档说的比较详细,不过没有组合使用的案例,需要自行理解。这里正确的方法是先用 value 绑定数据,再使用 onInput 事件动态修改。

代码如下:

javascript 复制代码
  <textarea value="{{valueTextarea}}" onInput="handleTextarea" ></textarea>
  <input value="{{valueInput}}" onInput="handleInput" />
  Page({
  data: {
    valueTextarea: '',
    valueInput: ''
  },
  // textarea
  handleTextarea: function(e) {
    this.setData({
      valueTextarea: e.detail.value,
    });
  },
  // input
  handleInput: function(e) {
    this.setData({
      valueInput: e.detail.value,
    });
  },
});

支付宝和学习强国都是如此操作,他俩本就一脉相承,相比 vue 确实没有那么方便,但是没有办法。

END

相关推荐
旭日猎鹰5 分钟前
Flutter踩坑记录(二)-- GestureDetector+Expanded点击无效果
前端·javascript·flutter
zmd-zk37 分钟前
flink学习(2)——wordcount案例
大数据·开发语言·学习·flink
一条晒干的咸魚42 分钟前
【Web前端】创建我的第一个 Web 表单
服务器·前端·javascript·json·对象·表单
Chef_Chen1 小时前
从0开始学习机器学习--Day33--机器学习阶段总结
人工智能·学习·机器学习
花海少爷1 小时前
第十章 JavaScript的应用课后习题
开发语言·javascript·ecmascript
尘浮生1 小时前
Java项目实战II基于微信小程序的电影院买票选座系统(开发文档+数据库+源码)
java·开发语言·数据库·微信小程序·小程序·maven·intellij-idea
sinat_384241091 小时前
在有网络连接的机器上打包 electron 及其依赖项,在没有网络连接的机器上安装这些离线包
javascript·arcgis·electron
hopetomorrow2 小时前
学习路之压力测试--jmeter安装教程
学习·jmeter·压力测试
hopetomorrow2 小时前
学习路之PHP--使用GROUP BY 发生错误 SELECT list is not in GROUP BY clause .......... 解决
开发语言·学习·php
小牛itbull2 小时前
ReactPress vs VuePress vs WordPress
开发语言·javascript·reactpress