APP开发公司 微信小面貌开导篇之踩坑记载

武汉app开发

你的位置:武汉app开发 > 联系我们 > APP开发公司 微信小面貌开导篇之踩坑记载
APP开发公司 微信小面貌开导篇之踩坑记载
发布日期:2024-07-18 15:55    点击次数:81

最近参与开导了公司的第一款小面貌,开导体验基本近似于基于webview的夹杂式开导,不错调用官方浩大的api,但也有一些坑或者说不俗例的处所。这篇著述从实用性动身,记载了开导经过中的一些问题:

1. 方式优先级浩瀚

在使用button组件时,发目下class中树立width不顺利,底下贴上代码:

经过微信调试器具排查后,发现user agent的方式优先级确凿大于咱们我方写的方式类,这在浏览器中基本是不行能发生的事情

惩处决策其实比拟肤浅,给width添加!important的后缀或者即可,修改后咱们再看一下后果:

加上!important之后,其实宽度的实践后果如故顺应咱们的预期了,关联词微信调试器具却仍然败露user agent方式优先,这应该算是调试器具的一个bug吧。

2. 鄙俗UI组件封装,参数界说繁琐

一般UI视觉稿中的基础组件,举例button,是有特定方式的:譬如说背景况/字体。诈欺小面貌的Component函数封装成组件,编写默许方式并继承外部传入的class,不错便捷后续开导。

React有<tag {...props}></tag>这种写法,即组件继承props不作念处理,只透传给下一个组件,但小面貌不复古这种写法(苦搜无果,官方文档也莫得阐扬)。

这就意味着咱们需要把总共button组件复古的参数皆摆列在properties中:

3. 全局方式遴荐器*被禁用

上头的代码在编译的时候就会报错,因为小面貌禁用了这类遴荐器。斗胆测度具体原因:这类作用限度比拟广的遴荐器和自界说组件的方式顽固产生了打破??

那若何去给小面貌添加全局通用方式?看来只可我方把用到的标签皆手动写一遍了,还好网上有现成的代码不错贴:

4. 自界说组件,bind:tap调用两次

封装基础组件时,举例button,底下的写法应当幸免:

这么封装出来的组件,会触发两次tap事件,武汉app开发一次是小面貌自己触发的,一次是通过triggerEvent触发。

不错换一个非小面貌内置的事件类型,比如click:

抑制tap事件冒泡也不错惩处:

5. 在wxml顶用Boolean()作念类型转机

举例在一个组件中,监听一个String类型的参数,若是不为空则败露text标签,不然不败露:

这种写法,leftText字段很彰着如故传递了,关联词依旧不败露text标签,当换一种写法后:

这么便是正确的,顺应咱们的渴望。

神奇吧?

6. InnerAudioContext调用seek模范后,onTimeUpdate回调失效

InnerAudioContext用于播放音频,给它传入onTimeUpdate回调从而取恰面前的播放进程。

关联词当调用seek模范跳转到指定位置播放时,onTimeUpdate就不再被调用了。

小面貌社区其实许多东说念主如故提过这个问题,或者阅历了1年半的技能可微信团队迟迟莫得栽种,只可暂时使用折中的认识来栽种,惩处决策其实很肤浅:

先暂停播放,再引申seek模范,然后树立或者500ms的延时调用play模范。

7. InnerAudioContext取得duration的时机问题

本思在音频播放前拿到duration应该是兑现不明显,网上对于调用onPlay、onCanplay的说法皆不太靠谱,其中一个决策是这么的:

且不说setTimeout树立几许毫秒合适,真机上是无效的。

因此如故老安分实的用onTimeUpdate:

若是说以为每次onTimeUpdate皆要算计一次很耗性能的话,不错自行兑现只算计一次。

8. 树立页面背景况

面前页面的json文献中有个backgroundColor字段,关联词树立后无效,背面发现这个字段暗示的不是可见区域的背景况,而是页面下拉时窗口的背景况。

亚军玛丽娅-埃尔南德斯(Maria Hernandez)来自西班牙,获得10.8分,世界排名从251位上升到188位。

若是需要树立页面背景况,不错通过page标签的方式树立:

软件开发 回归

到此这篇对于微信小面貌开导篇之踩坑记载的著述就先容到这了APP开发公司,更多干系微信小面貌开导踩坑内容请搜索剧本之家往日的著述或不竭浏览底下的干系著述但愿全球以后多多复古剧本之家!

您可能感敬爱的著述:使用taro开导微信小面貌际遇的坑回归Echarts在Taro微信小面貌开导中的踩坑记载微信小面貌开导之你可能莫得踩过的神坑回归

Powered by 武汉app开发 @2013-2022 RSS地图 HTML地图

Copyright Powered by365站群 © 2013-2024 云迈科技 版权所有