尧图建网站 尧图建网站 YAOTU WEB BUILD 免费咨询
ARTICLE DETAIL

资讯详情

深耕网站建设与建站编程的一线实战洞察。

鸿蒙6.1 arkui.UIContext UI上下文坑:runScopedTask不是runScopedOnUiThread

鸿蒙6.1 arkui.UIContext UI上下文坑:runScopedTask不是runScopedOnUiThread 本文是「鸿蒙 6.1 API 23 开发坑系列」第 4 篇ArkUI 桶第 4 篇。本篇讲ohos.arkui.UIContextnamespaceAPI 10鸿蒙 6.1 API 23 基座——UI 上下文UIContextclass 11 个子管理器 runScopedTaskgetFrameNodeById。鸿蒙坑根因①runScopedTask(callback)是 UIContext 实例方法不是runScopedOnUiThreadReactrunInNativeViewvs 鸿蒙runScopedTaskUI 操作必须在 UI 线程②getUIContext()是组件方法不是全局函数this.getUIContext()不是getUIContext()③UIContext有 11 个子管理器getFont/getMediaQuery/getRouter/getPromptAction/getComponentUtils/getUIObserver/getOverlayManager/getDragController/getMeasureUtils/getFocusController/getAtomicServiceBar④getFrameNodeById(id)返回FrameNode | null不是FrameNode⑤getFilteredInspectorTree(filters?)返回stringJSON 字符串不是 object。一、开篇鸿蒙 UIContext 不是 React useContext是「11 个子管理器的 UI 上下文」你写 React 时UI 上下文用useContext返回 context value无子管理器// React useContext返回 context value无子管理器 const uiContext useContext(UIContext) // ❌ React useContext 返回 context value无子管理器 const showToast () promptAction.showToast() // ❌ React promptAction 是全局函数不是子管理器你写鸿蒙 ArkTS 时UI 上下文用UIContextclass11 个子管理器 runScopedTask// ArkTS UIContextclass 有 11 个子管理器 runScopedTaskUI 线程跑 callback import { UIContext, Font, MediaQuery, Router, PromptAction } from ohos.arkui.UIContext const uiContext: UIContext this.getUIContext() // ✅ this.getUIContext() 组件方法取 UIContext 实例 // ✅ UIContext 有 11 个子管理器getFont/getMediaQuery/getRouter/getPromptAction 等 const fontManager: Font uiContext.getFont() // ✅ getFont() 取 Font 子管理器 const routerManager: Router uiContext.getRouter() // ✅ getRouter() 取 Router 子管理器 const promptAction: PromptAction uiContext.getPromptAction() // ✅ getPromptAction() 取 PromptAction 子管理器 // ✅ runScopedTask 在 UI 线程跑 callbackUI 操作必须在 UI 线程 uiContext.runScopedTask(() { /* UI 操作 */ }) // 鸿蒙坑根因UIContext 有 11 个子管理器runScopedTask 不是 runScopedOnUiThreadReact useContext vs 鸿蒙 UIContext 的区别React 把 UI 上下文当 context valueuseContext返回 value无子管理器promptAction 是全局函数ArkTS 把 UI 上下文当 class 实例UIContextclass 有 11 个子管理器getFont/getRouter/getPromptAction等是 UIContext 实例方法不是全局函数runScopedTask在 UI 线程跑 callback。根因不是 context value 是 class 实例——鸿蒙 UIContext 有 11 个子管理器promptAction 是 UIContext 子管理器不是全局函数。二、根因鸿蒙 arkui.UIContext 的五个绑定机制鸿蒙ohos.arkui.UIContextnamespaceAPI 10核心导出UIContextclass Font/MediaQuery/Router/PromptAction/ComponentUtils/UIObserver/OverlayManager/DragController/MeasureUtils/FocusController等子管理器。机制 1runScopedTask 是 UIContext 实例方法——不是 runScopedOnUiThread// ❌ 鸿蒙坑runScopedOnUiThread 不存在编译错 Property runScopedOnUiThread does not exist const uiContext: UIContext this.getUIContext() // ❌ 编译错Property runScopedOnUiThread does not exist on type UIContext uiContext.runScopedOnUiThread(() { /* UI 操作 */ }) // ❌ runScopedOnUiThread 不存在 // ✅ 正确用法runScopedTask(callback) 是 UIContext 实例方法UI 线程跑 callback uiContext.runScopedTask(() { // ✅ runScopedTask 在 UI 线程跑 callback // ✅ UI 操作必须在 UI 线程runScopedTask 保证 UI 线程执行 }) // 鸿蒙坑根因runScopedTask 不是 runScopedOnUiThread——React runInNativeView vs 鸿蒙 runScopedTaskrunScopedTask 坑根因UIContext.runScopedTask(callback: () void): void是 UIContext 实例方法在 UI 线程跑 callback不是runScopedOnUiThread鸿蒙 SDK 无此方法名触发Property runScopedOnUiThread does not exist on type UIContext编译错。鸿蒙坑ReactrunInNativeViewvs 鸿蒙runScopedTask——鸿蒙 UI 线程跑 callback 用runScopedTask。机制 2getUIContext 是组件方法不是全局函数——this.getUIContext() 不是 getUIContext()// ❌ 鸿蒙坑getUIContext() 全局函数调用编译错Cannot find name getUIContext // ❌ 编译错Cannot find name getUIContext const uiContext getUIContext() // ❌ getUIContext 不是全局函数 // ✅ 正确用法this.getUIContext()——组件实例方法 Entry Component struct Index { demonstrate() { // ✅ this.getUIContext() 是组件方法不是全局函数 getUIContext() const uiContext: UIContext this.getUIContext() // ✅ 组件方法获取 UIContext 实例 } } // 鸿蒙坑根因getUIContext 是组件方法不是全局函数必须 this.getUIContext()getUIContext 坑根因getUIContext(): UIContext是组件实例方法在ets/component/common.d.ts的 Component 声明里不是全局函数getUIContext()触发Cannot find name getUIContext编译错。另外ohos.window的window实例也有getUIContext(): UIContext方法window 实例方法不是全局函数。机制 3UIContext 有 11 个子管理器——getFont/getMediaQuery/getRouter/getPromptAction 等// ✅ UIContext 的 11 个子管理器每个是 UIContext 实例方法不是全局函数 const uiContext: UIContext this.getUIContext() // ✅ 11 个子管理器UIContext 实例方法不是全局函数 const fontManager: Font uiContext.getFont() // ✅ getFont() 取 Font 子管理器 const mediaQuery: MediaQuery uiContext.getMediaQuery() // ✅ getMediaQuery() 取 MediaQuery 子管理器 const routerManager: Router uiContext.getRouter() // ✅ getRouter() 取 Router 子管理器 const promptAction: PromptAction uiContext.getPromptAction() // ✅ getPromptAction() 取 PromptAction 子管理器 // ✅ 还有 7 个子管理器getComponentUtils/getUIObserver/getOverlayManager/getDragController/getMeasureUtils/getFocusController/getAtomicServiceBar // 鸿蒙坑根因UIContext 有 11 个子管理器每个是 UIContext 实例方法不是全局函数11 个子管理器坑根因UIContextclass 有 11 个子管理器实例方法getFont(): FontAPI 10字体管理器、getMediaQuery(): MediaQueryAPI 10媒体查询、getRouter(): RouterAPI 10路由管理器、getPromptAction(): PromptActionAPI 10弹窗管理器、getComponentUtils(): ComponentUtilsAPI 10组件工具、getUIObserver(): UIObserverAPI 10UI 观察器、getOverlayManager(): OverlayManagerAPI 11浮层管理器、getDragController(): DragControllerAPI 11拖拽管理器、getMeasureUtils(): MeasureUtilsAPI 12测量工具、getFocusController(): FocusControllerAPI 12焦点管理器、getAtomicServiceBar(): NullableAtomicServiceBarAPI 12原子化服务栏。鸿蒙坑每个子管理器是 UIContext 实例方法不是全局函数——React promptAction 是全局函数鸿蒙 promptAction 是 UIContext 子管理器。机制 4getFrameNodeById 返回 FrameNode | null——不是 FrameNode// ✅ getFrameNodeById(id): FrameNode | null——通过组件 id 取 FrameNode返回 | null const uiContext: UIContext this.getUIContext() // ✅ getFrameNodeById 返回 FrameNode | null不是 FrameNode找不到返回 null const frameNode: FrameNode | null uiContext.getFrameNodeById(snapshotTarget) // ✅ 返回 FrameNode | null // ✅ 找不到组件 id 返回 null不是 throw 错不是 undefined if (frameNode ! null) { // ✅ frameNode 是 FrameNode 实例getFrameNodeById 找到组件 id } // 鸿蒙坑根因getFrameNodeById 返回 FrameNode | null找不到返回 null 不是 undefinedgetFrameNodeById 坑根因UIContext.getFrameNodeById(id: string): FrameNode | nullAPI 11通过组件 id 取 FrameNode返回FrameNode | null不是FrameNode找不到组件 id 返回null不是undefined不是 throw 错。鸿蒙坑getFrameNodeById返回FrameNode | null赋给FrameNode会触发Type FrameNode | null is not assignable to type FrameNode编译错——必须用FrameNode | null接收 null 检查。机制 5getFilteredInspectorTree 返回 stringJSON——不是 object// ✅ getFilteredInspectorTree(filters?): string——取组件树 JSON string 不是 object const uiContext: UIContext this.getUIContext() // ✅ getFilteredInspectorTree 返回 stringJSON 字符串不是 object const inspectorTree: string uiContext.getFilteredInspectorTree() // ✅ 返回 string 不是 object // ✅ 要用 JSON.parse(inspectorTree) 转 objectgetFilteredInspectorTree 直接返回 JSON 字符串 const treeObject: object JSON.parse(inspectorTree) // ✅ JSON.parse 转 object // 鸿蒙坑根因getFilteredInspectorTree 返回 stringJSON 字符串不是 objectgetFilteredInspectorTree 坑根因UIContext.getFilteredInspectorTree(filters?: Arraystring): stringAPI 12取组件树 JSON 字符串返回string不是object。鸿蒙坑getFilteredInspectorTree直接返回 JSON 字符串不是 object要用JSON.parse(inspectorTree)转 object——React DevTools 组件树是 object鸿蒙getFilteredInspectorTree是 JSON 字符串。三、真机配图鸿蒙 arkui.UIContext UI 上下文坑——runScopedTask 11 个子管理器真机配图展示初始态鸿蒙 6.1 arkui.UIContext UI 上下文坑标题目标组件红框 idsnapshotTarget场景1~7 卡片要点说明getUIContext 验证态点击「① 验证 getUIContext」按钮显示「✅ getUIContext() 是组件方法不是全局函数」runScopedTask 验证态点击「② 验证 runScopedTask」按钮显示「✅ runScopedTask 在 UI 线程跑 callback 验证成功」11 个子管理器验证态点击「③ 验证 getFont」「④ 验证 getMediaQuery」「⑤ 验证 getRouter getPromptAction」按钮显示「✅ getFont/getMediaQuery/getRouter/getPromptAction 子管理器验证成功」getFrameNodeById getFilteredInspectorTree 态点击「⑦ 验证 getFrameNodeById」「⑧ 验证 getFilteredInspectorTree」按钮显示「✅ getFrameNodeById(“id”) 取 FrameNode | null 验证成功」「✅ getFilteredInspectorTree() 取组件树 JSON 验证成功」四、真解法鸿蒙 arkui.UIContext 的四个场景场景 1getUIContext runScopedTask——90% 场景首选import { UIContext } from ohos.arkui.UIContext Entry Component struct Index { demonstrateScopedTask() { // ✅ this.getUIContext() 组件方法取 UIContext 实例不是全局函数 getUIContext() const uiContext: UIContext this.getUIContext() // ✅ 组件方法 // ✅ runScopedTask 在 UI 线程跑 callbackUI 操作必须在 UI 线程 uiContext.runScopedTask(() { // ✅ runScopedTask 不是 runScopedOnUiThread // ✅ UI 操作Text/Button 等组件操作必须在 UI 线程 }) } build() { Column({ space: 8 }) { Text(demo) } } } // getUIContext runScopedTask90% 场景首选this.getUIContext() 组件方法 runScopedTask UI 线程跑鸿蒙 arkui.UIContext API 真名坑import { UIContext, Font, MediaQuery, Router, PromptAction } from ohos.arkui.UIContextnamed importUIContext是export declare classAPI 10getUIContext(): UIContext是组件方法this.getUIContext()runScopedTask(callback: () void): void是 UIContext 实例方法不是runScopedOnUiThreadSysCapSystemCapability.ArkUI.ArkUI.Fullcrossplatformatomicservice。场景 211 个子管理器——getFont/getMediaQuery/getRouter/getPromptActionimport { UIContext, Font, MediaQuery, Router, PromptAction } from ohos.arkui.UIContext const uiContext: UIContext this.getUIContext() // ✅ 11 个子管理器UIContext 实例方法不是全局函数 const fontManager: Font uiContext.getFont() // API 10 FontregisterFont/getSystemFontList const mediaQuery: MediaQuery uiContext.getMediaQuery() // API 10 MediaQuerymatch/orientation const routerManager: Router uiContext.getRouter() // API 10 Routerpush/replace/back const promptAction: PromptAction uiContext.getPromptAction() // API 10 PromptActionshowToast/showDialog // ✅ 还有 7 个子管理器 // uiContext.getComponentUtils(): ComponentUtils // API 10 组件工具 // uiContext.getUIObserver(): UIObserver // API 10 UI 观察器 // uiContext.getOverlayManager(): OverlayManager // API 11 浮层管理器 // uiContext.getDragController(): DragController // API 11 拖拽管理器 // uiContext.getMeasureUtils(): MeasureUtils // API 12 测量工具 // uiContext.getFocusController(): FocusController // API 12 焦点管理器 // uiContext.getAtomicServiceBar(): NullableAtomicServiceBar // API 12 原子化服务栏 // 11 个子管理器每个是 UIContext 实例方法不是全局函数鸿蒙 11 个子管理器 API 真名坑getFont(): FontAPI 10registerFont/getSystemFontList/getFontByNamegetMediaQuery(): MediaQueryAPI 10match/on(change)getRouter(): RouterAPI 10push/replace/back/getStategetPromptAction(): PromptActionAPI 10showToast/showDialog/showActionMenugetComponentUtils(): ComponentUtilsAPI 10getRectangleByIdgetUIObserver(): UIObserverAPI 10on(scroll)/on(willScroll)getOverlayManager(): OverlayManagerAPI 11getDragController(): DragControllerAPI 11getMeasureUtils(): MeasureUtilsAPI 12getFocusController(): FocusControllerAPI 12getAtomicServiceBar(): NullableAtomicServiceBarAPI 12返回Nullable可能 null鸿蒙坑每个子管理器是 UIContext 实例方法不是全局函数——React promptAction 是全局函数鸿蒙 promptAction 是 UIContext 子管理器uiContext.getPromptAction()。场景 3getFrameNodeById——通过组件 id 取 FrameNodeimport { UIContext } from ohos.arkui.UIContext import { FrameNode } from ohos.arkui.node const uiContext: UIContext this.getUIContext() // ✅ getFrameNodeById(id): FrameNode | null——通过组件 id 取 FrameNode返回 | null const frameNode: FrameNode | null uiContext.getFrameNodeById(snapshotTarget) // ✅ 返回 FrameNode | null // ✅ 找不到组件 id 返回 null不是 throw 错不是 undefined if (frameNode ! null) { // ✅ 必须用 FrameNode | null 接收 null 检查 // ✅ frameNode 是 FrameNode 实例可操作 RenderNode/getRenderNode 等 } // getFrameNodeById返回 FrameNode | null找不到返回 null 不是 undefined鸿蒙 getFrameNodeById API 真名坑getFrameNodeById(id: string): FrameNode | nullAPI 11返回FrameNode | null不是FrameNode找不到返回null不是undefined不是 throw 错鸿蒙坑赋给FrameNode会触发Type FrameNode | null is not assignable to type FrameNode编译错——必须用FrameNode | null接收 null 检查。场景 4getFilteredInspectorTree——取组件树 JSON 字符串import { UIContext } from ohos.arkui.UIContext const uiContext: UIContext this.getUIContext() // ✅ getFilteredInspectorTree(filters?): string——取组件树 JSON 字符串返回 string 不是 object const inspectorTree: string uiContext.getFilteredInspectorTree() // ✅ 返回 string 不是 object // ✅ 要用 JSON.parse(inspectorTree) 转 objectgetFilteredInspectorTree 直接返回 JSON 字符串 const treeObject: object JSON.parse(inspectorTree) // ✅ JSON.parse 转 object // ✅ getFilteredInspectorTreeById(id, depth, filters?): string——按 id depth 取子树 JSON const subTree: string uiContext.getFilteredInspectorTreeById(snapshotTarget, 3) // ✅ 按 id depth3 取子树 // getFilteredInspectorTree返回 stringJSON 字符串不是 object鸿蒙 getFilteredInspectorTree API 真名坑getFilteredInspectorTree(filters?: Arraystring): stringAPI 12取组件树 JSON 字符串返回string不是objectgetFilteredInspectorTreeById(id: string, depth: number, filters?: Arraystring): stringAPI 12按 id depth 取子树 JSON 字符串鸿蒙坑直接返回 JSON 字符串不是 object要用JSON.parse(inspectorTree)转 object——React DevTools 组件树是 object鸿蒙getFilteredInspectorTree是 JSON 字符串。五、一句话哲学写鸿蒙 ArkUI 记住UIContext 不是 React useContext 是「11 个子管理器的 UI 上下文」——鸿蒙 6.1 API 23ohos.arkui.UIContextnamespaceAPI 10鸿蒙 6.1 API 23 基座UIContextclass 11 个子管理器SysCap SystemCapability.ArkUI.ArkUI.Fullcrossplatform atomicservice。根因不是 context value 是 class 实例——runScopedTask(callback: () void): void是 UIContext 实例方法❌ 不是runScopedOnUiThread✅ UI 线程跑 callbackReactrunInNativeViewvs 鸿蒙runScopedTaskgetUIContext(): UIContext是组件方法✅this.getUIContext()不是全局函数getUIContext()❌getUIContext()触发Cannot find name getUIContextUIContext有 11 个子管理器✅getFont/getMediaQuery/getRouter/getPromptAction/getComponentUtils/getUIObserver/getOverlayManager/getDragController/getMeasureUtils/getFocusController/getAtomicServiceBar每个是 UIContext 实例方法不是全局函数React promptAction 是全局函数鸿蒙 promptAction 是 UIContext 子管理器getFrameNodeById(id: string): FrameNode | null✅ 返回FrameNode | null不是FrameNode找不到返回null不是undefinedgetFilteredInspectorTree(filters?: Arraystring): string✅ 返回stringJSON 字符串不是object要用JSON.parse转 object。runScopedTask 不是 runScopedOnUiThread getUIContext 是组件方法不是全局函数 11 个子管理器是鸿蒙 6.1 arkui.UIContext UI 上下文坑核心能力系列回链鸿蒙 7.0 新特性篇 1~17沉浸式毛玻璃/Component3D/智能体框架/方舟引擎/星盾安全/星河互联/空间音频/可变字体/游戏快启/分布式数据盾/LTPO 可变帧率/AI 文档识别/多形态服务窗口/AI 反诈/机密计算/空间计算/小艺全面进化鸿蒙 6.1 API 23 开发坑系列篇 1「ArkUI.modifier 装饰器坑」——attributeModifier AttributeModifier鸿蒙 6.1 API 23 开发坑系列篇 2「arkui.componentSnapshot 组件截图坑」——get/getSync/createFromBuilder 返回 image.PixelMap鸿蒙 6.1 API 23 开发坑系列篇 3「arkui.node 节点坑」——NodeController abstract class makeNode override BuilderNode WrappedBuilder鸿蒙 6.1 API 23 开发坑系列篇 4「arkui.UIContext UI 上下文坑」——runScopedTask 不是 runScopedOnUiThread 11 个子管理器本文
返回列表