微信小程序双向绑定
欢迎加入前端交流群交流知识获取视频资料:749539640
vue、angular的双向绑定如下示例:
<div>
<input type="text" [(ngModel)]="name">
{{name}}
</div>
你不需要多余的操作就可以实现这么简单的双向绑定,但是在小程序里就不是这么玩的了
<view>
<input bindinput="bindName" value='{{name}}'></input>
{{name}}
</view> bindName(e) {
//方法一
this.data.name = e.detail.value;
this.setData({
name: this.data.name
})
//方法二
this.setData({
name: e.detail.value
})
}
说一下方法一和方法二的区别:
方法一:第一步先赋值,值发生了变化,但是这个时候页面不会渲染为新数据,你需要调用setData才能刷新页面视图!
方法二:赋值并刷新视图
微信小程序双向绑定的更多相关文章
- 微信小程序のwxml绑定
一.微信小程序文件的构成 微信小程序包括js文件.json文件.wxml文件.wxss文件.wxs文件.js文件是展现界面的,注册这个程序的的页面,一般一个大写的Page({ })嵌入: json文件 ...
- 微信小程序——获取绑定事件元素的ID
小程序list数据带值跳转,一般直接通过设置item的id来标识或者通过设置键值data-xxxx的方式标识.如下图所示: 解析出来的结果如下图: 我们看到它在元素上绑定了一个checkSchoolL ...
- 微信小程序 事件绑定 bind和catch 区别
转自:https://blog.csdn.net/xiaoqiang_0719/article/details/79729592 本文以冒泡事件tap(手指触摸后马上离开,也就是点击事件)为例子来区别 ...
- 微信小程序 bindcontroltap 绑定 没生效
微信 bindcontroltap 绑定 没生效 多次查看官方文档,代码没有问题, 解决: windows下 显示设置中 缩放必须是100%,
- 微信小程序事件绑定
一 通过实例来认识 (一) 给出代码 我们直接通过一个实例来引入我们想要讲解的内容: <input type="text" bindinput="handleInp ...
- 微信小程序 --- 事件绑定
事件类别: tap:点击事件: longtap:长按事件: touchstart:触摸开始: touchend:触摸结束: touchcansce:取消触摸: 事件绑定: bind绑定: catch绑 ...
- 微信小程序~事件绑定和冒泡
[1]事件绑定和冒泡 事件绑定的写法同组件的属性,以 key.value 的形式. key 以bind或catch开头,然后跟上事件的类型,如bindtap.catchtouchstart.自基础库版 ...
- 微信小程序开源项目库汇总
最近做了一个微信小程序开源项目库汇总,里面集合了OpenDigg 上的优质的微信小程序开源项目库,方便移动开发人员便捷的找到自己需要的项目工具等,感兴趣的可以到GitHub上给个star. UI组件 ...
- 微信小程序开源项目库集合
UI组件 weui-wxss ★852 - 同微信原生视觉体验一致的基础样式库 Wa-UI ★122 - 针对微信小程序整合的一套UI库 wx-charts ★105 - 微信小程序图表工具 wema ...
随机推荐
- 陷门函数Trapdoor Function
陷门函数:正向计算是很容易的,但若要有效的执行反向计算则必须要知道一些secret/knowledge/trapdoor(知识?),也称为伪随机置换,可用于构造公钥密码系统. 若 f 为陷门函数,则 ...
- c# CefSharp
一. CefSharp简单来说就是一款.Net编写的浏览器包,方便你在Winform和WPF中内嵌的Chrome浏览器组件. https://github.com/cefsharp/CefSharp ...
- unity3d 嵌入iOS的 In App Purchase 应用程序内购买
Unity做东西是快,但是有些功能是需要额外开发的,比如 IAP (In App Purchase,应用程序内购买) 还好unity提供了灵活的扩展功能,允许嵌入原生代码来做一些unity未实现的功能 ...
- centos7 vim环境优化
centos7默认是使用vi,而不是使用vim,所以,我们需要修改一下vi的别名,并且,我们使用neovim,vi毕竟还是有很多功能比较原始 所以 yum install neovim -ycat & ...
- idea快捷键整合-无鼠标操作idea
查找所有快捷键 Ctrl + Shift + A.输入action或操作的名字. 全屏模式 使用Alt+V快捷键,弹出View视图,然后选择Enter Full Screen. 进入这个模式后,我想看 ...
- WPScan使用完整攻略:如何对WordPress站点进行安全测试
转载自FreeBuf.COM 严正声明:本文仅限于技术探讨,严禁用于其他目的. 写在前面的话 在这篇文章中,我将告诉大家如何使用WPScan来对WordPress站点进行安全测试. WPScan是Ka ...
- Tomcat 目录结构
bin目录主要是用来存放tomcat的命令,主要有两大类,一类是以.sh结尾的(linux命令),另一类是以.bat结尾的(windows命令). 很多环境变量的设置都在此处,例如可以设置JDK路径. ...
- MFC中使用ADO进行数据库操作
参考FROM:http://hi.baidu.com/sunkanghome/item/e1fda510b3186359f1090ee2 数据库与数据库编程: 当前各种主流数据库有很多,包括Oracl ...
- Android 变量取名神器
前言 在工作中,我们还在为起变量名而苦恼吗?今天无意间发现一个专门为变量取名而诞生的神器 codelf. 我们可以直接浏览器访问 http://unbug.github.io/codelf/ 现在我们 ...
- 1.3.3 并发容器类MAP/LIST/SET/QUEUE
HashMap 下标计算方法:hashCode & (length-1) ,&按位与操作,二进制相同位都是1,该位才为1 JDK1.7与JDK1.8中HashMap区别: JDK1.8 ...