SuperAPI AI 工具集

react-native-dev

前端与建站

查看项目

更新于 10-15 17:26

技能介绍

用途:面向 React Native 与 Expo 应用的实战开发指南,帮助构建可用于生产的移动端应用,内容覆盖 UI、动画、状态、测试、性能与部署。

主要能力与参考文档:导航(Expo Router 的 Stack、Tabs、NativeTabs、链接、模态、表单页、上下文菜单);组件(FlashList 模式、expo-image、安全区、原生控件、模糊/玻璃效果、存储);样式(StyleSheet、NativeWind/Tailwind、平台样式、主题、暗色模式);动画(Reanimated 3 的进入/退出、共享值、手势、滚动驱动);状态管理(Zustand 的 selector 与 persist、Jotai 的 atom 与派生、React Query、Context);表单(React Hook Form + Zod 的校验、多步、动态数组);网络(fetch 封装、React Query 乐观更新、鉴权 token、离线、API 路由、webhook);性能(剖析流程、FlashList + memo、包体分析、TTI、内存泄漏、动画性能);测试(Jest、React Native Testing Library、Maestro 端到端);原生能力(相机、定位、权限 hook、触感、通知、生物识别);工程化(项目结构、路径别名、SDK 升级、EAS 构建与提交、CI/CD)。

用法与关键约定:新项目可执行 npx create-expo-app@latest my-app --template blank-typescript,再 npx expo install expo-router react-native-safe-area-context react-native-screens,按需安装 expo-image、react-native-reanimated、react-native-gesture-handler,并在 package.json 设置 "main": "expo-router/entry"、app.json 添加 scheme,删除 App.tsx 与 index.ts,创建 app/_layout.tsx 与 app/(tabs)/_layout.tsx 及路由文件;Web 支持可安装 react-native-web、react-dom、@expo/metro-runtime。优先用 Expo Go(npx expo start)验证,仅在需要本地 Expo 模块、Apple 目标或 Expo Go 不含的第三方原生模块时用 eas build。条件渲染用 {count > 0 && <Text />};动画只动 transform 与 opacity;导入直接从源文件而非 barrel 文件;长列表用 FlashList、图片用 expo-image;路由文件用 kebab-case。

限制:具体版本兼容性与平台行为需以官方文档为准;未提供收费、价格与效果数据。相关技能包括 flutter-dev、ios-application-dev、android-native-dev。