- 博客(43)
- 收藏
- 关注
RSS订阅原创 鸿蒙RN position: ‘absolute‘ 和 zIndex 的兼容性问题（转自千问）
这主要是因为 RN 的鸿蒙端实现（通常指 react-native-harmony 或 @ohos/rn-ohos）在底层渲染机制上与 Android/iOS 存在显著差异。如果不做补偿，绝对定位元素会发生肉眼可见的偏移。在标准 RN 中，zIndex 仅控制同级元素的堆叠，但在鸿蒙的某些实现中，它的行为更像 Web 的 z-index，会穿透嵌套层级。在 Android/iOS 上，我们习惯使用逻辑像素，但在鸿蒙设备（尤其是 Hi3861 等开发板或高 DPI 设备）上，底层坐标系可能基于物理像素。
2026-04-17 11:12:20
319
原创 鸿蒙（HarmonyOS）支持 useNativeDriver的详细说明（转自千问）
默认开启，按需关闭：对于位移、缩放、旋转，必须开启，否则在鸿蒙低端设备上会出现明显掉帧。透明度单独处理：涉及opacity的动画，请直接设置。组合动画注意：如果你在一个或中同时使用了位移和透明度，只要其中包含不支持原生驱动的属性，整个动画配置通常建议设为false，或者将动画拆分为两组分别执行。
2026-04-16 20:30:05
361
原创 检查hooks依赖的工具（转自千问）
你提到的这个“检查依赖是否正确”的工具，通常指的不是一个独立的第三方库，而是 React 官方推荐并内置在 ESLint 中的插件规则。它就是 eslint-plugin-react-hooks。这个插件是 React 开发中的标准配置，它会在你写代码时进行静态分析，自动检查useEffectuseMemo等 Hooks 的依赖数组是否完整，防止因遗漏依赖而产生的闭包陷阱和 Bug。
2026-04-16 19:55:27
54
原创 RN使用，鸿蒙与安卓不兼容的代码合集（求大佬留言补充，扩散）
1、鸿蒙端的 FastImage 在 resizeMode='contain' 下，图片内容的对齐行为和 iOS/Android 不一致 — 鸿蒙默认不会将 contain 后的图片内容居中在容器内。修复方式是把尺寸和 margin 提到外层 TouchableOpacity 上，并加上 justifyContent: 'center' 和 alignItems: 'center'，让 FastImage 在容器内居中显示。
2026-04-13 21:18:03
45
原创 在鸿蒙手机上，measure 和 measureInWindow 返回的 y / pageY 在滑动组件后值不变问题
因为 List 容器本身不在滚动内容里（它是滚动容器），所以它的 measureInWindow 返回值即使在鸿蒙上也是相对稳定的，再配合手动减去 rightScrollOffsetRef.current 就能得到正确的屏幕坐标。在鸿蒙手机上，measure 和 measureInWindow 返回的 y / pageY 在滑动组件后值不变，是因为这两个 API 在鸿蒙的 RNOH Fabric 渲染器下，返回的是组件相对于其父容器（或布局树）的静态布局坐标，而不是相对于屏幕视口的实时坐标。
2026-04-08 13:46:55
288
原创 RN优化加载速度思路，与实践记录（理论转自千问，实践源于自己的项目）
表格优先级优化项🔴 高启用 Hermes、首屏最小化、图片 WebP、Splash 优化🟠 中代码分割、延迟初始化、列表虚拟滚动、移除无用依赖🟢 低字体子集、RAM Bundle（已过时）、Bitcode💡记住不要过早优化！先用工具测量真实瓶颈，再针对性解决。通过以上策略，多数 RN 应用可将冷启动时间从3–5秒优化至1–2秒内。如需具体场景（如大型电商 App、含 WebView 的混合应用）的深度优化方案，欢迎补充细节！
2026-03-04 20:03:10
406
原创 如何避免React Native 跨项目模块混淆问题
这次日志已经把根因暴露得很清楚：orderDetail 业务包里 require('./App') 仍然命中了A项目 App 模块（__MODULE_IDENTIFIER__ = 20260210_APage_DETAIL），所以不是加载顺序问题本身，而是模块命名/ID 冲突。如果你愿意，我下一步可以顺手把 App.tsx 改成只做转发（export { default } from './OrderWithApp'），彻底统一入口，后续更不容易回归。1) 清 Metro 缓存并重启。
2026-02-11 17:13:10
80
原创 Metro配置端口
表格场景操作临时换端口固化端口修改的start脚本Android 连接开发者菜单 → 设置 Debug Server 为IP:端口iOS 连接通常自动，必要时手动配置 Bundler🌐注意：端口仅影响开发调试阶段，不影响生产构建（release 包不依赖 Metro）。
2026-01-14 11:15:07
345
原创 JavaScript 中!!、?? 和 || 使用介绍
表达式判断条件返回值示例`ab`a??b如果a是null或undefined返回b!!a将a转为布尔值true或false!!x→“x 是真还是假？a || b→“a 有没有值？没有就用 b”（把0""当“没有”）a??b→“a 是 null/undefined 吗？是就用 b”（更精准的默认值）📌现代 JS 开发中，优先使用??设置默认值，避免||的陷阱！??自ES2020起支持，所有现代浏览器和 Node.js 14+ 均可用。
2025-12-29 17:44:19
861
原创 Warning: Cannot update during an existing state transition (such as within `render`). Render methods
jsx编辑// ❌ 如果 store 是全局 Redux store// ❌ 在 render 中调用，触发 dispatch✅修复将副作用移到useEffect或使用+ 事件触发jsx编辑// 安全：在 effect 中调用// 或通过按钮触发地方能否更新状态？替代方案函数组件顶层（render 主体）❌ 绝对禁止→ 移入useEffectJSX 表达式{...}中❌ 禁止→ 改为变量或函数调用（但函数不能含 setState）useEffect。
2025-11-25 21:00:13
392
原创 TypeError: Proxy handler is null 错误的原因和修复方法
TypeError: Proxy handler is null 错误已经完全修复！
2025-11-18 15:23:13
384
原创 Omit＜＞的用法
的自定义选择器组件，通过这种方式可以更好地控制组件的接口和行为。是一个回调函数，当用户选择某个选项时触发，接收选中的值。这个类型定义本身是正确的，但要确保它能正常工作，关键在于。类型的数组，通常用于定义多列选择器的每一列数据。这个类型定义通常用于封装一个更高级的、基于。这部分表示在剔除上述属性后，再“添加”上。这几个类型是否正确定义并被正确引入。这两个新的必需属性。
2025-11-05 17:54:13
265
原创 react native中 createAsyncThunk 的详细说明，及用法示例(转自通义千问)
是 Redux Toolkit 提供的一个核心工具，专门用于在 React Native（或 React）应用中处理异步操作。它能自动为您生成处理异步生命周期（pending, fulfilled, rejected）的 action，并将这些状态与您的 Redux store 紧密集成，从而极大地简化了异步逻辑的编写。将异步请求的逻辑（如网络请求）与状态更新逻辑（如设置 loading 状态）分离开，使代码更清晰。：当异步操作成功完成时触发，并携带返回的数据。：当异步操作失败时触发，并携带错误信息。
2025-11-01 14:36:00
366
原创 鸿蒙键盘遮挡react native内容尝试
'padding' : 'position'} // iOS 用 padding，Android 用 position。60 : 0} // iOS 中补偿导航栏高度。onPress={() => console.log('提交内容:', text)}placeholder="请输入内容"title="提交"
2025-09-29 15:26:05
410
原创 react native PanResponder拖拽过程中修改状态坐标值重置问题
修改状态时，组件状态会重置，使用useRef跨渲染周期存储组件状态。
2025-07-10 11:31:40
259
原创 Error: Text strings must be rendered within a ＜Text＞ component.
RN默认加载组件时，数据可能初始化有问题，导致组件返回空字符串，也会报这个错误。解决方法：检查报错的组件返回值是否正确。返回字符串是错误的。
2025-05-20 13:38:14
198
原创 react native ‘style‘ 不是‘StyleProp＜ImageStyle＞‘类型
升级 React Native 和相关类型包：bash复制代码检查是否有社区修复的补丁。关键检查点审查样式对象：确保传递给<Image>的style不包含或其他<Image>不支持的属性。避免样式复用：不要将<View>或<Text>的样式直接用于<Image>。类型定义版本：确保使用的版本与 React Native 版本匹配。如果问题仍未解决，请提供样式对象的具体定义，以便进一步分析。
2025-04-22 15:33:03
440
原创 react native ＜Image＞ 没有onPress方法
如果坚持要在<Image>上使用onPress（需自定义类型）：tsx复制代码// 扩展 ImageProps 类型（临时方案）onPress?// 使用时仍需确保逻辑正确（Image 本身不会响应点击）<Image/>关键检查点组件选择：优先使用或处理点击事件。类型安全：避免强制扩展原生组件的 props 类型，除非明确知道后果。视觉反馈：根据需求选择是否添加点击反馈（如透明度变化）。如果问题仍未解决，请检查是否导入了正确的组件或存在其他类型冲突。
2025-04-22 14:55:24
432
原创 react-native-gesture-handler 拖拽 捏合 嵌套使用示例
"react-native-reanimated": "3.3.0",（不确定是否要安装此依赖）
2025-04-18 18:48:58
440
原创 android平台 rn 使用 高德地图 ts代码示例(出自文心一言)
在 React Native 中使用高德地图时，可以通过第三方库如或来实现。不过，由于高德地图官方并没有直接提供一个完全集成且支持 TypeScript 的 React Native 库，我们通常会结合社区维护的库和原生模块来实现。以下是一个使用的简单示例，展示如何在 Android 上使用高德地图，并结合 TypeScript 进行开发。
2025-04-16 11:10:20
618
原创 鸿蒙原生页面与react native页面互相跳转
鸿蒙内嵌RNapp的页面，通过嵌套arkts组件按钮，点击按钮使用NavPathStack跳转鸿蒙页面。通过TurboModule方法调用Router方法跳转。1、NavPathStack跳转。2、Router跳转（未尝试）
2025-04-03 10:53:50
315
原创 代码冲突处理
这个错误信息表示你尝试推送的分支（branch）的尖端（tip）落后于其远程对应分支。这通常发生在远程分支已经被其他人更新，而你的本地分支还没有包含这些更新时。这个流程确保了你的本地分支包含了远程分支的所有最新更改，从而避免了推送时被拒绝的情况。如果你经常遇到这种问题，建议定期从远程仓库拉取更新，以保持你的本地分支是最新的。如果在合并过程中遇到冲突，Git 会提示你哪些文件有冲突。命令来拉取远程分支的最新更改并合并到你的本地分支。例如，如果你的远程仓库是在。命令切换到出问题的分支。例如，如果你的分支名是。
2025-03-21 15:29:16
259
原创 react native使用Android Studio模拟器调试开发环境配置遇到的问题
1、npx react-native doctor 提示Android SDK识别失败，改用代码配置使用33版本。解决方法：降低组件使用版本，gesture-handler使用2.18.0，screens使用4.0.0。使用Android Studio选择修改使用的JVM版本，并设置Grandle user home路径。2、JVM版本不兼容。3、提示组件构建失败。
2025-03-10 16:43:22
478
原创 react native使用Android Studio模拟器调试，Unable to load script
原因是模拟器用错了，用了Intel x86_64。正确的应该使用Google APIs Intel x86_64(根据电脑系统和芯片，选择适当的)
2025-03-05 20:08:11
619
原创 PanResponder回调函数的简要说明
当React Native的响应者与原生组件的响应者冲突时调用。类似，但它在“捕获”阶段被调用，这意味着它会在冒泡阶段之前被调用，允许它阻止冒泡阶段的事件处理。: 当手势被另一个组件或视图接管时调用，或者当手指离开屏幕且当前组件是响应者时调用（与。: 当手指移动时，判断当前组件是否应该成为响应者（即处理手势的组件）。: 当另一个组件成为响应者时调用，即当前组件未能成为响应者。: 当手势开始（即触摸开始并确认当前组件为响应者）时调用。: 当当前组件成为响应者时调用，表示它现在有权处理手势。
2025-02-27 10:34:21
501
原创 Animated.timing 的用法介绍
是 React Native 中用于创建基于时间的动画的函数之一。它允许你通过指定一个动画的起始值、结束值、持续时间以及其他参数来控制动画的执行。是 React Native 中AnimatedAPI 的一部分，用于创建流畅的动画效果。
2025-02-24 10:53:52
679
原创 React Native的滑动手势功能
React Native的滑动手势。首先，我需要回想React Native中处理滑动手势的常用方法。React Native本身没有内置的滑动手势组件，所以可能需要用PanResponder或者第三方库。PanResponder是React Native自带的，可以用来检测触摸事件。记得要在组件的生命周期里正确设置PanResponder，比如在constructor或者useEffect里。然后处理onPanResponderGrant、onMoveShouldSetPanResponder这些方法。
2025-02-21 17:30:44
978
原创 鸿蒙RN中使用react-native-safe-area-context
本文内容来自：zh-cn/react-native-safe-area-context.md · react-native-oh-library/usage-docs - Gitee.com请到三方库的 Releases 发布地址查看配套的版本信息：@react-native-oh-tpl/react-native-safe-area-context Releases 。对于未发布到npm的旧版本，请参考安装指南安装tgz包。进入到工程目录并输入以下命令：yarn下面的代码展示了这个库的基本
2025-02-18 21:05:42
1043
原创 HarmonyOS 创建 createAudioCapturer 时候报错误码 6800301
createAudioCapturer 错误码 6800301
2024-11-14 20:10:40
1261
原创 热更新调试鸿蒙版flutter代码步骤(harmonyos next flutter debug)
harmonyos flutter 调试热更新
2024-10-31 11:01:39
1327
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人