【鸿蒙南向开发】Flutter使用Ohos原生组件的方法

📚往期笔录记录🔖：

🔖鸿蒙（HarmonyOS）北向开发知识点记录~
🔖鸿蒙（OpenHarmony）南向开发保姆级知识点汇总~
🔖鸿蒙应用开发与鸿蒙系统开发哪个更有前景？
🔖嵌入式开发适不适合做鸿蒙南向开发？看完这篇你就了解了~
🔖对于大前端开发来说，转鸿蒙开发究竟是福还是祸？
🔖鸿蒙岗位需求突增！移动端、PC端、IoT到底该怎么选？
🔖记录一场鸿蒙开发岗位面试经历~
🔖持续更新中……

Flutter中有些功能使用原生组件包装会更简单，本文以flutter_filereader的实现过程为例说明Ohos中使用原生组件的实现方法。

Filereader插件的作用是显示本地文件，在安卓和iOS上都使用系统webview实现，所以在Ohos上也采用了同样的思路。鸿蒙化主要的增量修改点如下

自定义Component和PlatformView

实现关键点：

1、使用AppStorage交换Component和PlatformView之间的数据

2、使用@Watch装饰器监听数据变化

使用原生组件自定义Component

AppStorage.setOrCreate('url', '')

@Component
struct FileReaderComponent {
   
   
  @Prop params: Params
  filereaderView: FileReaderView = this.params.platformView as FileReaderView
  @StorageLink('url') @Watch('onOpenFile') url: string = ''

  controller: webview.WebviewController = new webview.WebviewController();
  build() {
   
   
    Column() {
   
   
      Web({
   
    src: this.url, controller: this