HarmonyOS ListItem是否可以复用的特殊情况

ListItem是否可以复用的特殊情况。

1.在ListItem中，需要使用条件语句去渲染，大概有20中类型的view.问题是使用了if条件语句渲染，ListItem里面的view是否还可以进行复用？对效率是否有提升。

2.因为的itemView类型太多了。我想使用WrappedBuilder弄一个view的工厂进行返回，那么@Builder方法装饰的view是否可以进行复用？又在哪里设置 .reuseId()。

@Builder 
function buttonBuilder(params: Params) { 
 Column() { 
  Button(params.text) 
   .fontSize(12) 
   .borderRadius(8) 
   .borderWidth(2) 
   .backgroundColor(Color.Orange) 
 } 
} 
 
wrapBuilder: WrappedBuilder<[Params]> = wrapBuilder(buttonBuilder);
if (cellType.itemType == ItemType.GROUP_HEADER) { 
 GroupHeaderItem({ data: cellType as GroupHeaderData }) 
  .reuseId(cellType.itemType) 
} else if (cellType.itemType == ItemType.SECOND_ITEM_TITLE) { 
 SecondHeaderItem({ data: cellType as SecondHeaderData }) 
  .reuseId(cellType.itemType) 
} else if (cellType.itemType == ItemType.INFORMATION) { 
 InformationItem({ data: cellType as InformationData }) 
  .reuseId(cellType.itemType) 
} else if (cellType.itemType == ItemType.EXPRESS_NEWS) { 
 ExpressNewsItem({ data: cellType as InformationData }) 
  .reuseId(cellType.itemType) 
} else if (cellType.itemType == ItemType.MY_STOCK_NEWS) { 
 MyStockNewsItem({ data: cellType as InformationData }) 
  .reuseId(cellType.itemType) 
} else if (cellType.itemType == ItemType.MARKET_INDEX) { 
 ...... 
} else { 
 TestItem({ data: cellType }).reuseId(cellType.itemType) 
}

HarmonyOS

Heiang

2024-08-29 11:12:30

浏览

回答 1

待解决

回答 1

按赞同

按时间

put_get

1、在ListItem中，需要使用条件语句去渲染，大概有20种类型的view.问题是使用了if条件语句渲染，ListItem里面的view是否还可以进行复用？对效率是否有提升

答：可以复用，只要配合LazyForEach和@Reusable就可以实现组件复用的效果，且对于不同的组件，其实不用声明reuseId也可完成复用过程，可以通过查看aboutToReuse生命周期是否执行来判断组件是否复用。关于aboutToReuse，可以参考以下文档：

https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-custom-component-lifecycle-V5#ZH-CN_TOPIC_0000001847050604__abouttoreuse10

经分析，开发者您的应用场景并不适合使用reuseId。一般只有在同一种自定义组件的不同实例之间存在较大的结构差异时，会使用reuseId进行二次区分，提高复用效率，而开发者您在不同的itemType中设置的都是不同的自定义组件，所以可以不必设置reuseId。

2、因为的itemView类型太多了。我想使用WrappedBuilder弄一个view的工厂进行返回，那么@Builder方法装饰的view是否可以进行复用？又在哪里设置 .reuseId()

答：@Reusable完全支持@Builder方法装饰的view复用，因为@Builder所修饰的并非一个自定义组件，而是构建函数，所以在组件复用时不会作为一个父节点去查看其缓存队列。关于这点，可以通过ArkUI Inspector工具查看整体的UI树结构，会发现@Builder 所修饰的函数没有对应函数名的组件实例。所以不用担心。

ArkUI Inspector教程文档：

https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/ide-arkui-inspector-0000001605524877-V5

而对于reuseId，可以参考第一个问题的回答，此场景可以不使用也能达成复用效果

3、@Builder方式内部无法定义@State？

@State是隶属于组件级别的状态管理机制，而@Builder只是构建函数，并非一个自定义组件。如果需要传递@State成员进入@Builder，以便进行状态管理，可以参考使用$$符号进行按引用传递，能够实现状态传递至@Builder函数内

详情可以参考：

https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/arkts-builder-V5#ZH-CN_TOPIC_0000001893210149__%E6%8C%89%E5%BC%95%E7%94%A8%E4%BC%A0%E9%80%92%E5%8F%82%E6%95%B0

如果您想在@Builder将状态变量传递给三方组件，最好的方法是在父组件内定义@State，并通过按引用传递透传到@Builder函数中，再为三方组件赋值（即您代码所示的用法）。从设计的角度讲，@State成员作为描述组件的状态变量，确实没办法在一个函数域内声明。