抖音小程序填坑指南

最近抖音小程序比较火,公司部门也想尝试获取一些流量,于是开始吭哧吭哧不断徘徊于踩坑与填坑之间,下面记录一些最近小程序开发中碰到的各种问题~

1.https://microapp.bytedance.com/ 首先是小程序开发平台;这里提一句抖音小程序实际就是字节跳动小程序,开发一个小程序可以在它旗下的今日头条和抖音共同使用;编辑器的话可以在这个开发平台下载字节跳动开发者工具,也可以使用vscode或者webstorm等其他编辑器,可以安装一些编辑器插件,这样开发起来更舒适;如果不想直接原生开发也可以去找一些开发框架,不过我这里是直接原生开发,抖音小程序出来的时间还是太短了,就怕架子会产生更多的问题。

2.开发中碰到的让人抓狂的事情:

1⃣️image组件默认了宽度和高度

实在是不理解为什么要这样设置,mode的模式感觉也不太好用;使用图片组件的时候还是需要注意一下使用场景不同带来的影响;

2⃣️真机调试有问题,抖音扫码后显示加载20%不到就自动挂掉了?

别怕,只是偶尔发生,反正总是得给点惊喜不是;相信也会越来越好的~我是在刚下载完编辑器然后写了个demo尝试真机测试,结果就显示加载失败,当时还是比较蒙的,没有报错,也不知道是什么原因,后来发现它自己好了;所以,遇到此类问题,别怕,再等等~

3⃣️组件上做数据绑定逻辑渲染,不能函数调用

这个就让人很难受了,对于习惯react写法的我来说,只能在模版里写字符串运算/三木运算符/数运算等简单运算,而不能写一些函数是多愁人的一件事情;比如你在渲染模版的时候想用数组的includes方法做一些处理,直接在模版里进行编写判断,然后它会告诉你---啊,你不能这样,去用其他方式实现! oh,我想静静。。

4⃣️组件有点少啊,没有table原生标签?

当我需要去开发一个可以上下左右滑动并且左边第一列固定的表格时,翻了翻组件文档,哈,咋没有table?好吧,那就用view自己拼吧。。

5⃣️background-image不能引用本地图片,只能引用网络图片及base64?

what?好吧,那像之前做微信小程序一样也转base64好了~

6⃣️想快速上线,先把基本信息完善了

如果你想快速上线,最好在一开始就把账号的基本信息全完善了,确定好你的小程序的类型,审核也是非常费时间的;

7⃣️短视频挂载小程序还要审核?

如果你们有自己的抖音账号并且想要发视频的时候挂载小程序,那么你最好先去提交申请视频挂载(https://forum.microapp.bytedance.com/mini-app/posts/5e997dcc25528f023c3d9a57),这也需要审核!!!

8⃣️图表插件用不了?

想画Echarts图表却用不了?没事,转后台去做,让后端引入一个图表插件库转成base64传给前端,前端用小程序的canvas组件去绘制~

9⃣️绘制的锁定第一列的表格组件当再次进入页面时计算高度有问题?

因为没有表格组件,并且需求较为复杂 ,所以自己用view组件封了个可上下左右滑动的锁定第一列的表格组件;锁定的第一列单元格的高度是使用boundingClientRect去获取每行tr的高度进行赋值;本来很有成就感的开发完了,结果发现第二次进入页面tr高度的计算出现了偏差!一开始觉得是页面没有卸载的问题,困扰很久之后试了很久发现并不是,这是一个时效的问题,在获取高度时页面还没有渲染最终真实的高度;采用定时器去延缓获取高度的时间,完美解决!

目前先写这么多,后续有时间再更~本博文只为记录自己的开发实践,当然如果能帮到陌生的你那更好了~

你可能感兴趣的:(抖音小程序,前端)