build方法里面使用判断语句问题

当前在build里面只能使用if else方法去处理不同显示效果, 我们有个场景,楼层列表页面,根据后台模版参数,展示不同的楼层组件。我们大概有50-60个模版,现在只能在ForEach里面写很多个if else来展示不同的楼层组件,有没有更高效、更简洁的方式实现呢?

HarmonyOS
2024-12-26 15:15:08
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
Heiang

文档参考:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-apis-arkui-node-V5

具体示例代码:

import { UIContext } from '@ohos.arkui.UIContext';
import { NodeController, BuilderNode, FrameNode } from '@ohos.arkui.node';


declare class Params {
  text: string
}

@Builder
function buttonBuilder(params: Params) {
  Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.SpaceEvenly }) {
    Text(params.text)
      .fontSize(12)
    Button(`This is a Button`, { type: ButtonType.Normal, stateEffect: true })
      .fontSize(12)
      .borderRadius(8)
      .backgroundColor(0x317aff)
  }
  .height(100)
  .width(200)
}

class MyNodeController extends NodeController {
  private rootNode: BuilderNode<[Params]> | null = null;
  private wrapBuilder: WrappedBuilder<[Params]> = wrapBuilder(buttonBuilder);

  makeNode(uiContext: UIContext): FrameNode | null {
    if (this.rootNode === null) {
      this.rootNode = new BuilderNode(uiContext);
      this.rootNode.build(this.wrapBuilder, { text: "This is a Text" })
    }
    return this.rootNode.getFrameNode();
  }
}


@Entry
@Component
struct Index {
  private baseNode: MyNodeController = new MyNodeController()

  build() {
    Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Start, justifyContent: FlexAlign.SpaceEvenly }) {
      Text("This is a NodeContainer contains a text and a button ")
        .fontSize(9)
        .fontColor(0xCCCCCC)
      NodeContainer(this.baseNode)
        .borderWidth(1)
        .onClick(() => {
          console.log("click event");
        })
    }
    .padding({ left: 35, right: 35, top: 35 })
    .height(200)
    .width(300)
  }
}
分享
微博
QQ
微信
回复
2024-12-26 17:33:22
相关问题
HarmonyOS Web组件UserAgent判断方法
378浏览 • 1回复 待解决
求助镜像语言环境判断方法
5844浏览 • 1回复 待解决
【bearpi】hb build -f出现问题
1053浏览 • 0回复 待解决
linux 安装Nginx configure --build=NAME问题
2587浏览 • 1回复 待解决
build.gradle中的签名问题
8037浏览 • 2回复 待解决
JS 镜像语言环境判断方法
4897浏览 • 1回复 待解决
linux shell利用for语句依次输出
6288浏览 • 1回复 待解决
变脸类型判断问题
210浏览 • 1回复 待解决
Build Hi3861总是出现这种问题
2471浏览 • 0回复 待解决
判断使用问题
346浏览 • 1回复 待解决
C++同步调ArkTS里面方法
1389浏览 • 1回复 待解决
mysql查看哪个语句占用了连接?
2373浏览 • 1回复 待解决