鸿蒙NEXT开发浅进阶到精通10:鸿蒙开发项目中遇到的问题及解决笔记03
相关知识点 鸿蒙中AsyncAwait的问题细究、grid 方格不均匀布局实现、ASCF框架老项目,升级dev编辑器后报错,购物车悬浮窗上的总购物车数量的增加逻辑、objectLink监听多层数据、设置默认获焦并拉起软键盘 、滑动组件套滑动,滚动事件冲突处理、Map数据的使用,比if Switch简便,比枚举差不多
写在前面
时光荏苒啊,感觉整理两三次我这一年留的东西就给发完了,希望这些开发中遇到的实际问题真的可以帮助你在项目中披荆斩棘。我们下期就要做一篇打包上架相关的全流程整理了,以及个人开发者账号上架多个项目,证书复用的相关问题,最近的项目任务挺重,欢迎大家持续关注和理解凹。
一、鸿蒙中Async Await的问题细究
这是我在项目中另外一位二十年程序员大佬麾下做小弟的时候,给的谆谆教导,他说你的代码老是很巧妙的闯对,看起来有问题,在鸿蒙里没啥事,正常运行也没啥风险。那就是常用 await,后来我们项目组要优化性能方面的问题,删除多余的await也是其中之一。
async 让其修饰的函数返回类型多一层 Promise,,而await是去掉一层Promise。在JS中会逐层嵌套,滥用会导致不好的接收效果,但特殊地方可能用到
而在ARKTS中,
多加 async 会导致双层或多层Promise<Promise<T>> 手写返回类型多层不报错,但编辑器都会自动解开,变为一层Promise<T>
有点绕,大家可以一起讨论凹。
二、老程序员的代码规范,看到年轻的不一样的就想多说几句
1-英语命名单词规范,编辑器下提示,要再去字典查一下正确单词
2-async滥用,只不过在鸿蒙ArkTS中巧了,自动解开多层Promise为一层
3-请求入参,尽可能写请求方法内部,外部有参数为传入简单类型,,若参数相对固定,也不做分页加载,可把参数写死在请求方法内部, 函数封装质量:外部使用不传参 >传简单参数>传对象参数
4-类型名 大驼峰 变量命名-小驼峰。。。。(搜驼峰命名)
5-一个参数有多个枚举,就先定义枚举,不然那你有天跑路了这个代码怎么维护,或者自己也过段时间忘了。
三、grid 方格不均匀布局,计算器布局
在早期grid组件可谓是方格或者栅栏或者什么名字来的布局的神器了,但随着鸿蒙API更新到17,也有更多的布局组件出现。我们看下这种比较常见的布局场景

// grid 方格不均匀布局
Grid() {
ForEach([1,2,3], (item:number,index) => {
if (index==0) {
GridItem(){
Text('item'+item)
.backgroundColor('#FF55')
.height('100%').width('100%').borderRadius(8)
}
.rowStart(0)
.rowEnd(2)
}else {
GridItem(){
Text('item'+item)
.backgroundColor('#FF55')
.height('100%').width('100%').borderRadius(8)
}
}
})
}
.height(100)
.columnsTemplate('1fr 1fr')
.rowsTemplate('1fr 1fr')
.columnsGap(8)
.rowsGap(8)
在这里使用grid 系列的组件时,要从外往内去考虑,大体的顺序,你要先确定.columnsTemplate(‘1fr 1fr’) 和.rowsTemplate(‘1fr 1fr’)也就是这个网格他是几行几列,然后往内去设置 rowStart(0) rowEnd 等。做起来才不会乱。如果是首次使用,可以多些几行先实现效果,再使用forEach简化。
四、ASCF框架老项目,升级dev编辑器后报错不能安装什么插件或者包
ASCF框架对小程序进行鸿蒙化,利弊参半吧,也是大佬们博弈的牺牲品,不过好在华为也没有中途放弃这一块的优化,据说会在秋季迎来更大的ASCF方面API的更新,在国博我们首次使用了ASCF框架来做项目,但那时候ASCF插件的版本是1。0.2,等我们做完离开到中间更新,也就一个月,新dev编辑器中的这插件就升级为1.0.3,那么这个更新在于对原小程序包中的三方组件,不无视了,就会报错,原来是无视不安装,我们的二次适配工作就是大部分在解决这些小程序插件在转化过程中的不安装导致的UI和手机相关能力的修正。
因为找不到报错记录了,反正你只要发现报错了,先这样试一下呗
"dependencies": {
//"@atomicservice/ascf-toolkit-hvigor-plugin": "~1.0.3-beta || ~1.0.3"
"@atomicservice/ascf-toolkit-hvigor-plugin": "1.0.2"
},
原因1,原小程序项目中有加载 @vant组件库或三方库,在新版本更新后,ASCF不再兼容或不再无视小程序内的组件安装,新版ASCF插件会检测和尝试加载,非鸿蒙的回说找不到或安装失败
解决1:在工程级hvigor-config.json5文件中,改变ASCF插件的版本为1.0.2,并去掉自动升级符号,因为1.0.3版本的ASCF插件会比较较真微信元素相关的插件了
解决2:在报错中,看具体哪个组件库鸿蒙ASCF不识别,根据路径删除对应库即可,但删除前要检查哪里引用了这个组件,尤其是md5相关的,要和项目负责人沟通,是否沿用微信小程序的加密方式。因为如果适配鸿蒙后的元服务使用华为登录、静默登录的话,无需再加密
五、 购物车悬浮窗上的总购物车数量,以接口返回为准
在每次添加购物车数量接口调用成功后也执行一次异步购物车总数量接口,在这个接口函数值去改变全局购物车数量的变量值,
错误总购物车数量增减,是直接在全局变量值上++ , 如 this.total++ 或-- ,这样在网络不顺畅或无网络时,会在执行增减某个购物车商品失败后,依旧增减购物车总数量
六、objectLink监听多层数据
objectLink监听多层数据,是监听到最后一次调用改类型数据,且上一次数据要使用new 类型()一次,如果是直接接收的后端数据,要做foreach处理为new
如typeA为 @Observed 定义的一个单元级数据类型,而我们接收的数据,可能在第三层才引用这个typeA,这时要注意监听typeA,要在最后这一层的数据上使用objectLInk
大家先参考官方这个案例,我们后面会专门做两期ObjectLink :https://developer.huawei.com/consumer/cn/doc/harmonyos-guides/arkts-observed-and-objectlink#使用abthisobject形式调用不会触发ui刷新
七、设置默认获焦并拉起软键盘 文本输入组件 textputin search
这个场景比较常见,比如我们点了首页的假搜索框,拉起新的界面并拉起手机键盘,
主要属性defaultFocus(true),要配合控制器对应控制器TextAreaController SearchController
controller: TextAreaController = new TextAreaController();
TextArea({ text: 'Hello World', controller: this.controller })
.width('95%')
.height(80)
.margin(10)
.defaultFocus(true)
controller: SearchController = new SearchController();
Search({ placeholder: '请输入', value: $$this.inputStr ,controller: this.controller})
.layoutWeight(1)
.defaultFocus(true)
八、滑动组件套滑动,滚动事件处理
Scroll中嵌套List,在内层滚动容器上添加nestedScroll,根据业务需要调整滚动优先级。这个我们好像前面在讲支付宝里一个UX效果渲染方式时讲过,我们最近项目上又遇到了两个滑动类组件套用的场景。
//在内层滚动容器上添加nestedScroll,根据业务需要调整滚动优先级
.nestedScroll({
scrollForward: NestedScrollMode.SELF_FIRST,
scrollBackward: NestedScrollMode.PARENT_FIRST
})
九、Map数据的使用,比if Switch简便,比枚举差不多
不要在使用if了,哈哈,我们在开发中常遇到后端返回数据type是一个数字,但我们要在 手机上展示某固定文字,但是跟后端争取多加一个字段无果后,那我们只能自己处理,除了最小白的if 和switch之外,我们还可以设置鸿蒙中的Map 容器
export const hotelLevelMap:Map<number,string> = new Map([
[1,'经济型'],
[2,'舒适型'],
[3,'高档型'],
[4,'豪华型'],
])
hotelLevelMap.get(this.item.type)
写在后面
好记性不如烂笔头吧,好在现在在线笔记的平台比较多,很多好戴拿才得以保存哈哈,有些问题我们没有深究,如果有兴趣,一起 探讨探讨,编程得学啊,我 很喜欢学编程。
更多推荐

所有评论(0)