百度小程序与微信小程序全面对比

百度小程序已出来了几个月了，我们从官方文档里面可以看出，微信有的功能基本都有，所以也推荐大家去官网学习。文档地址：https://smartprogram.baidu.com/docs/develop/tutorial/codedir/，有遇到问题的可以去百度小程序社区提问：https://smartprogram.baidu.com/forum/（需要登录并且有appid）。

本文分享一些百度小程序与微信小程序的差别。

百度小程序组件hidden属性区别

虽然百度小程序没提到这个属性，但我测试发现它在本地上和真机上都是支持的。但跟微信还是有一点区别：

js:

data: {
    flag:'123'
}

xml:

百度小程序输出：
2
4
8

微信输出：
4
8
10

百度：当hidden的值为flase，或者插值{{false}}为flase时，百度组件不会隐藏。其它情况，不管是true或者是空，或者其它值，不为false，或者计算出来的值不为flase，都会被隐藏。

微信：当这个hidden属性为空或者{{false}}插件值为false，才不会隐藏。有一种特殊情况就是直接赋值它为hidden="false"，这里的false不被当做布尔值，所以它也被隐藏。

结论：从上面这两个之中我们可以看到 4 和 8 两者都有，那我们做的时候只需要保证 hidden 的值为插值形式，并且插值的结果是布尔值，那两者就能得到一致的表现。

js文件命名空间wx.替换为swan.

wx.request() -> swan.request()
wx.showModal() -> swan.showModal()
wx.canIuse() -> swan.canIuse()
……

swan文件整体替换wx:到s-

主要有两个地方：

1.条件判断

wx:if -> s-if

2.列表循环

wx:for -> s-for
wx:for-item -> s-for-item
wx:key -> s-key

这里还有2点跟微信使用起来有点区别

1.for循环里面，百度是不支持跟if放在同一条语句里面。我们可以通过增加一个block来判断条件

2.条件判断百度是没有使用插值计算。

这是微信的：

 True 

这是百度的：

 True 

3.组件中的3元运算符，不支持 <= 判断，猜测可能是bug，可能是里面使用了正则判断。

{{ 1 <= 2 ? 'yes' : 'no' }}

解析出来的内容为：

true<="" view="">

解决方法是改成 >=，或者<

{{ 2 >= 1 ? 'yes' : 'no' }}

模板

1.声明需要使用的模板，data 是所需要传入到模板的值，当它是对象时，对象字面量是三个大括号包裹，微信是{{}}。