记录微信转支付宝小程序之间的差异。
公司写了一套gulp脚本,能使支付宝小程序支持大部分微信小程序语法,但还是有些许需手动兼容的差异。
注1:由于小程序api迭代较快,本文仅表示当前最新版本之前差异。
注2: 关于公司抹平差异化的脚步,单独再写一篇说明吧
标签模版类
| 微信 | 支付宝 |
|---|---|
| wx:if | a:if |
<i /> |
<icon /> |
<span /> |
<text /> |
说明:
支付宝的 <icon /> 不支持绑定事件,得外面包一层 <view /> 或换别的标签
a:if在a:for后无效,需要在子级中a:if 【抽象到子级】
事件类
| 微信 | 支付宝 |
|---|---|
| bind开头 | on开头 |
e.detail
子组件调用父组件的方法常去拿事件event里的detail ,微信小程序使用const { detail } = e,是由于微信小程序将传来的参数放在了detail里面,但是支付宝小程序不用进行这一步解构可以直接使用传过来的参数。
data-xxx
axml data- 属性可以获取到完整大写名,微信获取的是全小写【统一使用小写命名】
样式类
| 微信 | 支付宝 |
|---|---|
| 不同页面间样式隔离 | 全局共享==。 |
| 外部样式类) externalClasses | 不支持,自己写吧 |
解决办法:保证 支(sa)付(ba)宝 类名全局唯一吧
this.data & this.props
| 微信 | 支付宝 |
|---|---|
| properties与data中的数据统称为this.data.xxx | props传进来的需要使用this.props.xxx,data中的数据使用this.data.xxx |
this.setData({})一个props
| 微信 | 支付宝 |
|---|---|
| 支持使用this.setData()修改props属性值 | 不支持😒 |
抓包
| 微信 | 支付宝 |
|---|---|
| 随便抓 | just ios & 关闭安全代理 |
but: 支付宝小程序如果关闭安全代理,h5域名验证会失效,支付宝跳转会提示 “访问受限”。
自定义组件
usingComponents
| 微信 | 支付宝 |
|---|---|
| 定义组件名可以驼峰 | 必须小写或小写-小写 |
触发事件
| 微信 | 支付宝 |
|---|---|
自定义组件触发事件)时,需要使用 triggerEvent 方法,指定事件名、detail对象和事件选项 |
不干,换成propertiesprops里定义函数,然后通过this.props.xxx(param)触发 |
ref
| 微信 | 支付宝 |
|---|---|
给自定义组件一个id,然后通过*this*.selectComponent('#id名')拿 |
ref |
也许还有更多。。。