在HarmonyOS NEXT开发中如何点击一个按钮之后再进入flutter？

Question

在HarmonyOS NEXT开发中如何点击一个按钮之后再进入flutter？

本文参与了 【 HarmonyOS NEXT 技术问答冲榜，等你来战！】欢迎正在阅读的你也加入。

Answer 1

使用条件语句进行判断渲染：

struct Index { 
  private context = getContext(this) as common.UIAbilityContext 
  @LocalStorageLink('viewId') viewId: string = ""; 
  @State isFlutterPage:boolean = false; 
 
  build() { 
    Column() { 
      if (this.isFlutterPage) { 
        FlutterPage({ viewId: this.viewId }) 
      } else { 
        Button('跳转').width(50).height(50).onClick(()=> { 
          this.isFlutterPage = true; 
        }) 
      } 
    }.justifyContent(FlexAlign.Center).width('100%').height('100%') 
  } 
}

路由跳转：

import router from '@ohos.router'; 
@Entry 
@Component 
struct Index { 
  build() { 
    Column() { 
      Button('跳转').width(50).height(50).onClick(()=> { 
        router.pushUrl({ url: 'pages/FlutterPageIndex' }) 
      }) 
    }.justifyContent(FlexAlign.Center).width('100%').height('100%') 
  } 
} 
  
FlutterPageIndex 页面 
 
import { FlutterAbility } from '@ohos/flutter_ohos'; 
export default class EntryAbility extends FlutterAbility { 
 
} 
 
@Entry 
@Component 
struct FlutterPageIndex { 
 
  build() { 
    Column() { 
      FlutterPage() 
    }.width('100%').height('100%') 
  } 
}

本文参与了 【 HarmonyOS NEXT 技术问答冲榜，等你来战！】欢迎正在阅读的你也加入。