记录微信小程序迁移到字节跳动小程序踩坑｜ 8月更文挑战
这段时间公司要把微信小程序迁移到字节跳动小程序,在这里记录下一些些坑,以备以后查询
微信小程序要比字节跳动小程序早几年出品，所以开发文档、开发工具、基础库这些都是相对完善的。这里就记录下我本人踩过的坑了哈哈哈。
1. 文件差异
| 微信小程序 | 字节跳动小程序 | |
|---|---|---|
| 页面结构 | .wxml | .ttml |
| 页面样式 | .wxss | .ttss |
| 脚本语言 | .wxs | .sjs |
2. 组件 & API 差异
因为微信小程序的某些组件或者 API 是字节跳动小程序没有的或者不支持的，所以转成字节跳动小程序后可能要重新编写逻辑跟组件。
3. 自定义组件
3.1. 样式
字节跳动小程序现在不支持外部样式类
app.ttss 中的样式、组件所在页面的的样式对自定义组件无效（小编使用的最新开发者工具v3.1.1以及基础库2.14.0在app.ttss中是可以支持修改自定义组件的样式的）
3.2. observer
字节跳动不支持 observers，只能写在 properties 里面。
// 微信小程序
Component({
observers: { // 监听 properties 和 data 的变化
'numberA, numberB': function(numberA, numberB) {
this.setData({
sum: numberA + numberB
})
}
}
properties: {
myProperty: {
type: String,
value: '',
observer: function(newVal, oldVal) {
// 属性值变化时执行
}
},
myProperty2: String
}
})
// 字节跳动小程序
Component({
properties: {
myProperty: {
type: String,
value: '',
observer: function(newVal, oldVal) { // 只能在 properties 执行
// 属性值变化时执行
}
},
myProperty2: String
}
})
4. API(request) 差异
字节跳动小程序使用 request 请求传递 data 参数类型为 object 时，请求无效。需要把 data 参数 转换为 JSON 字符串
// 微信小程序
wx.request({
url: 'example.php',
data: {
x: '',
y: ''
},
success (res) {
console.log(res.data)
}
})
// 字节跳动小程序
tt.request({
url: 'example.php',
data: JSON.stringify({
x: '',
y: ''
}),
success (res) {
console.log(res.data)
}
})
总结（求关注）
字节跳动小程序虽然比微信小程序晚发布几年，但一定会追赶上微信小程序的。 最后再次感谢您的阅读，我是程序猿憨憨
欢迎关注我的公众号：A纲 Coder，获得日常干货推送。
