单向绑定 & 双向绑定
- 微信小程序只支持单向绑定,如果需要修改data的值,只能通过setData操作。
- Vue可以双向绑定,通过v-model
Mustache 语法支持(双括号{{}}中的表达式)
- 微信小程序只支持基本的三元运算、算数运算、逻辑判断、字符串运算、数据路径运算、数组对象以及 ... 扩展运算符。扩充wxs之后,可以自定义一些方法调用(PS:wxs语法比较别扭,es6不怎么支持,正则之类的写法都别扭)
- Vue支持全功能的JS表达式,特别是函数方法调用,比较方便。
视图更新
- 微信小程序初始化之后,针对data中的数据对象的任何修改(this.data.xxx=yyy)都不会触发视图更新,必须通过setData方法指定具体key值数据同步,才会触发视图的更新。
- Vue初始化时,会对data中的数据进行监听,只要数据修改(this.xxx=yyy),就会触发视图更新。
- 注意:Vue初始化只会监听已有字段,如果需要在data中新增属性key,需要调用$set方法,才能新增属性key并同时添加监听事件。直接操作data增加key,无法被Vue探测,无法响应式更新视图,会有延迟。
事件冒泡阻止
- 微信小程序事件冒泡,只能通过不同事件来操作,bindxxx事件不阻止冒泡,catchxxx事件阻止冒泡,如果需要动态判定,只能通过控制不同组件。
- Vue事件冒泡就是标准的web处理,在事件调用后通过代码触发,或者使用便捷语法.stop。W3C:e.stopPropagation()。或者IE:e.cancelBubble = true
扩展
- 小程序的逻辑层和渲染层是分开的
- 逻辑层运行在 JSCore 中,并没有一个完整浏览器对象,因而缺少相关的DOM API和BOM API;视图层的模板渲染、事件派发等操作都在native环境中。
- 数据对象(view-model)在两层间没有共享,同步通信成本太高,所以两层间通信类的操作就不太完善。
- 下表为小程序的运行环境:
运行环境 | 逻辑层 | 渲染层 |
---|---|---|
iOS | JavaScriptCore | WKWebView |
安卓 | V8 | chromium定制内核 |
小程序开发者工具 | NWJS | Chrome WebView |
网友评论