欢迎访问 生活随笔!

生活随笔

当前位置: 首页 >

字节小程序填坑说明

发布时间:2024/1/18 38 豆豆
生活随笔 收集整理的这篇文章主要介绍了 字节小程序填坑说明 小编觉得挺不错的,现在分享给大家,帮大家做个参考.

抖音和头条小程序都迁移到字节小程序了,只需要开发字节小程序就可以上架字节旗下支持小程序的App

准备条件 (类似于微信小程序)

申请开发者权限(Appid 字节小程序
工具下载 字节小程序开发工具

有微信小程序原生开发经验,开发字节小程序是没有学习成本

许多语法都是通用得,只是把 wx,换成tt
后面有把微信小程序转为字节小程序思路

基础结构

小程序项目中单个页面会依赖不同类型的文件:

.json 后缀的 JSON 配置文件
.ttml 后缀的 TTML 模板文件
.ttss 后缀的 TTSS 样式文件
.js 后缀的 JS 脚本文件


字节小程序解决了一些预览和调试问题

真机预览不限于本机,任何手机都可以(需要字节旗下App 如 头条,抖音),推送预览只能在抖音上面预览,扫码预览和真机调试(字节旗下App 如 头条,抖音都可以)这一块比微信小程序好,值得点赞,

代码编辑器

比任何编辑器都难用,比如开发页面时,需要实时看效果,编辑器卡的不能在卡,渲染卡,写页面卡,严重影响开发效率和速度,根本都没有开发体验这一说,纯纯的垃圾

上传代码问题

时不时都会出现网络问题
开发调试都没有问题,等上传代码发布,就报各种千奇百怪的语法错误

数据绑定 (跟微信小城一样)

不支持 Array 属性
不支持 String 属性

基础语法

<view> {{ message }} </view>

不支持语法

<view> {{ [1,2,3,4,5].includes(type)}} </view>

支持三目运算

<view> {{ type >1 '男' : '女'}} </view>

解决复杂的数据绑定 sjs插值表达式中的变量进行处理
sjs 对应 微信小程序 wxs

语法

<sjs module="Util" src="../../../utils-sjs.sjs"></sjs><view class="fcl999 f28">{{Util.enumerate(type)}}</view> Page({data: {message: "Hello World!",type:3}, });

utils-sjs.sjs sjs语法文档

var enumerate= function (type) {if type == 1) {return '男'} else if (type == 2) {return '女'} else {return '未知'} } module.exports = { enumerate:enumerate }

组件问题

不支持全局组件,全局注册了后,使用时会给出警告说,xx 为空,只能局部注册使用

部分API (手机号登录,获取位置,视频挂载到小程序)权限问题

才申请的小程序只有 60分 评价为C级

手机号登录,获取位置,支付等功能,字节管理的比微信小程序严格

以上权限不仅需要企业开发账号,还必须上线后去申请开通,且必须满足条件

手机号登录 (才申请的发布的小程序申请不到)评级达到B级及以上,信用分不低于90分 才能开通

获取位置 (才申请的发布的小程序申请不到) 评级A,信用分100分

关于授权手机号码问题

抖音的获取手机号码跟跟微信获取手机号码的区别在于

wxml 微信小程序

<button class="auth" type="default" size="mini" hover-class="none" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">获取手机号码</button>

可用在 getPhoneNumber 函数里面调用 wx.login 获取用户code 不管调用多少次都会成功换到手机号码

tt.ml 抖音小程序

<button bindtap="loginAuto">抖音登录</button> <button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumberHandler">获取手机号码</button>

获取手机号码想要每次都能获取必须按照以下步骤 先 tt.login 先获取 code 后在去 调用 获取
获取手机号码想要每次都能获取必须按照以下步骤 先 tt.login 先获取 code 后在去 调用 获取
获取手机号码想要每次都能获取必须按照以下步骤 先 tt.login 先获取 code 后在去 调用 获取
获取手机号码想要每次都能获取必须按照以下步骤 先 tt.login 先获取 code 后在去 调用 获取
获取手机号码想要每次都能获取必须按照以下步骤 先 tt.login 先获取 code 后在去 调用 获取

正确顺序是 ==》先调用 tt.login 在调用获取手机号码 (不能在同一个函数执行),顺序一定不能乱,顺序一定不能乱乱了
如果在获取手机号码里面去调用tt.login,重复第二次点击获取手机号码必定解析出错

此坑耗时接近一周才解决,还特意询问了抖音技术这边,按照他们的回复的调用顺序果然每一次都能成功

如果想微信那样在 获取 getPhoneNumber 手机号码 时区调用 login 接口,重复点击第二次必定会解析手机号码出错

第三方框架开发 如(uni-app)

存在问题

经常编译不出字节小程序代码(为空文件)体验极低

在加上字节开发工具 超级难用,一边编译不出源码,一边又卡

把原生微信小程序转为字节小程序

建议使用 Taro

Taro 官方支持 把原生小程序转化为 Taro 源码,在把转化的源码转为 字节小程序

uni-app 社区有支持

总结

以上是生活随笔为你收集整理的字节小程序填坑说明的全部内容,希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错,欢迎将生活随笔推荐给好友。