uni-app开发⼀套代码实现和⼩程序总结
最近刚结束⼀个项⽬，接到需求的的时候要求写⼀个⼩程序和，当时感觉没啥问题，但是后⾯告诉我⼀个个很坑的要求客户周期只有⼀个⽉⼩程序没问题，再加个就有点⼼慌了，然后只能去解决⽅案了，查之后到两个框架taro和uni，但是很明显啊两个都没⽤过花了两个⼩时看了两个⽂档然后问了另⼀个前端发现选taro时间上可能来不及（虽然我⽼想尝试taro了）因为taro是react的写法另⼀个同事没接触过啊如果选了taro 碰到坑我还得解决然后还要带着熟悉react 没办法只能uni了（当然本⼈没有嫌弃的意思，纯粹是想玩taro）。
吐槽结束，那么总结开始：
1. 因为我们开发项⽬的时候基本上都是使⽤开发者⼯具查看效果，那么问题就来了：为啥开发者⼯具上看着样式是好的，但是在⼿机上，公众
号项⽬会出现x轴出现滚动条。这个问题很简单啊，宽度超了呗。但是我疑惑啊，为啥⼩程序⾏，这⾥就不⾏，没道理啊。然后看是审查元素，发现出问题的地⽅不是画了border 就是来了margin，然后调试⼀下确实是他们引起的，那就改吧给⽗容器来个box-sizing: border-box;
，好了解决。可能你会发现项⽬跑在浏览器上⽊问题不也是H5吗？很明显啊是运⾏在上，浏览器内核是⼈家⾃⼰的啊
2.关于授权、⽀付、分享，这些东西，很明显和⼩程序是不⼀样的啊，那么简单啊各⾃对应的⽅法包起来呗打包不同的应⽤的时候启⽤不同的配置呗。uni上，暂时就只能想到这些，因为没到能配置我想要的东西的地⽅
3.关于分享图⽚这个可以说是开发中耗时最长的，因为刚开始我以为uni对这些都处理好了，不⽤我来担⼼，然后根据⽂档屁颠屁颠的⽤canvas画好了分享图（canvas⽤的实在是少，只能看⽂档）。最后发现⼀切都是我想多了，可能是我太年轻了。
1.如果是线上图⽚，那么图⽚的域名⼀定要是在downloadFile下配置的，包括头像制作
2.你的⼆维码是base64或者ArrayBuffer的那么使⽤getFileSystemManager写个本地地址吧，因为上的canvas不画base64啊
3.你画图的canvas，⼩程序和不⼀样啊，上⾯的事⼩程序可能碰到的那么下⾯就是的了
4.⼩程序上我们可能会算⽐例来保证分享图的宽⾼，那么就先别想了，写死吧（可能是我没到，惭愧啊）
5.⾄于图⽚吗，呵呵哒。跨域啊，能处理好跨域最好，处理不了那就⿇烦后台来个图⽚转base64的接⼝吧(我就是这样的)，下你放⼼，他能画base64,
6.然后就是你可能会碰到ctx.draw为啥不进⾥⾯的回调函数呢？来个简单的吧，给它外层来个setTimeout(我就给了200ms)，当然能直接执⾏的可以忽略
4.这⾥就是⾃⾝的分享了，在数据渲染完成之后，直接开始配置config，和制作分享信息吧，你就别想着等我点击分享那按钮之后再配置了，还有就是别忘了wx = require('jweixin-module');
好了，可能是写的项⽬不是很⼤，可能⼀些东西并没有踩到，希望当再次遇到之后，能有个看的地⽅，不要重来⼀遍。然后就是uni的好处了，有很好的ui组件库，特别是有个很全⾯的uView，当然如果不想使⽤的话，那么把vant的⼀套⼩程序的ui（他们可以说是很像）下载下来，⾃⼰整合成⼀个vue⽂件就搞定了（我很多就是这样⼲的...），快速开发下也就只能这样了
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。
发表评论