diff --git a/404.html b/404.html index 80f9310517b..d025d81bd3a 100644 --- a/404.html +++ b/404.html @@ -17,7 +17,7 @@ - +
diff --git a/about.html b/about.html index 4b48b6a355f..e64a46b9f08 100644 --- a/about.html +++ b/about.html @@ -17,7 +17,7 @@ - + diff --git a/architecture/bundled-hermes.html b/architecture/bundled-hermes.html index a095579ee64..1f4f410aeea 100644 --- a/architecture/bundled-hermes.html +++ b/architecture/bundled-hermes.html @@ -17,7 +17,7 @@ - + diff --git a/architecture/fabric-renderer.html b/architecture/fabric-renderer.html index 2edffc992df..1500b314e88 100644 --- a/architecture/fabric-renderer.html +++ b/architecture/fabric-renderer.html @@ -17,7 +17,7 @@ - + diff --git a/architecture/glossary.html b/architecture/glossary.html index 6b14b7f6ad8..113f8ec4fa9 100644 --- a/architecture/glossary.html +++ b/architecture/glossary.html @@ -17,7 +17,7 @@ - + diff --git a/architecture/landing-page.html b/architecture/landing-page.html index 229d4f9e9bd..01479445382 100644 --- a/architecture/landing-page.html +++ b/architecture/landing-page.html @@ -17,7 +17,7 @@ - + diff --git a/architecture/overview.html b/architecture/overview.html index 465c3c39f12..390a308adbf 100644 --- a/architecture/overview.html +++ b/architecture/overview.html @@ -17,7 +17,7 @@ - + diff --git a/architecture/render-pipeline.html b/architecture/render-pipeline.html index 98dd90328c6..061ba834eb6 100644 --- a/architecture/render-pipeline.html +++ b/architecture/render-pipeline.html @@ -17,7 +17,7 @@ - + diff --git a/architecture/threading-model.html b/architecture/threading-model.html index 211842d0ca1..675600f30e0 100644 --- a/architecture/threading-model.html +++ b/architecture/threading-model.html @@ -17,7 +17,7 @@ - + diff --git a/architecture/view-flattening.html b/architecture/view-flattening.html index d65c5dff78d..120aa8a1122 100644 --- a/architecture/view-flattening.html +++ b/architecture/view-flattening.html @@ -17,7 +17,7 @@ - + diff --git a/architecture/xplat-implementation.html b/architecture/xplat-implementation.html index 12c9365ddb6..d94829115b4 100644 --- a/architecture/xplat-implementation.html +++ b/architecture/xplat-implementation.html @@ -17,7 +17,7 @@ - + diff --git a/assets/js/0058b4c6.3e54ec6a.js b/assets/js/0058b4c6.3e54ec6a.js new file mode 100644 index 00000000000..6352351af24 --- /dev/null +++ b/assets/js/0058b4c6.3e54ec6a.js @@ -0,0 +1,14 @@ +"use strict"; +exports.id = 90849; +exports.ids = [90849]; +exports.modules = { + +/***/ 86164: +/***/ ((module) => { + +module.exports = /*#__PURE__*/JSON.parse('{"version":{"pluginId":"default","version":"0.76","label":"0.76","banner":null,"badge":false,"noIndex":false,"className":"docs-version-0.76","isLast":true,"docsSidebars":{"docs":[{"type":"category","label":"入门基础","items":[{"type":"link","label":"简介","href":"/docs/getting-started","docId":"getting-started","unlisted":false},{"type":"link","label":"核心组件与原生组件","href":"/docs/intro-react-native-components","docId":"intro-react-native-components","unlisted":false},{"type":"link","label":"React 基础","href":"/docs/intro-react","docId":"intro-react","unlisted":false},{"type":"link","label":"处理文本输入","href":"/docs/handling-text-input","docId":"handling-text-input","unlisted":false},{"type":"link","label":"使用滚动视图","href":"/docs/using-a-scrollview","docId":"using-a-scrollview","unlisted":false},{"type":"link","label":"使用长列表","href":"/docs/using-a-listview","docId":"using-a-listview","unlisted":false},{"type":"link","label":"特定平台代码","href":"/docs/platform-specific-code","docId":"platform-specific-code","unlisted":false},{"type":"link","label":"其他参考资源","href":"/docs/more-resources","docId":"more-resources","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"环境搭建","items":[{"type":"link","label":"搭建开发环境","href":"/docs/environment-setup","docId":"environment-setup","unlisted":false},{"type":"link","label":"集成到现有原生应用","href":"/docs/integration-with-existing-apps","docId":"integration-with-existing-apps","unlisted":false},{"type":"link","label":"集成到 Android Fragment","href":"/docs/integration-with-android-fragment","docId":"integration-with-android-fragment","unlisted":false},{"type":"link","label":"为电视和机顶盒制作应用","href":"/docs/building-for-tv","docId":"building-for-tv","unlisted":false},{"type":"link","label":"多平台支持","href":"/docs/out-of-tree-platforms","docId":"out-of-tree-platforms","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"开发流程","items":[{"type":"link","label":"在设备上运行","href":"/docs/running-on-device","docId":"running-on-device","unlisted":false},{"type":"link","label":"快速刷新","href":"/docs/fast-refresh","docId":"fast-refresh","unlisted":false},{"type":"link","label":"Metro","href":"/docs/metro","docId":"metro","unlisted":false},{"type":"link","label":"使用第三方库","href":"/docs/libraries","docId":"libraries","unlisted":false},{"type":"link","label":"使用 TypeScript","href":"/docs/typescript","docId":"typescript","unlisted":false},{"type":"link","label":"更新","href":"/docs/upgrading","docId":"upgrading","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"界面与交互","items":[{"type":"link","label":"样式","href":"/docs/style","docId":"style","unlisted":false},{"type":"link","label":"高度与宽度","href":"/docs/height-and-width","docId":"height-and-width","unlisted":false},{"type":"link","label":"使用 Flexbox 布局","href":"/docs/flexbox","docId":"flexbox","unlisted":false},{"type":"link","label":"图片","href":"/docs/images","docId":"images","unlisted":false},{"type":"link","label":"颜色","href":"/docs/colors","docId":"colors","unlisted":false},{"type":"category","label":"交互","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"处理触摸事件","href":"/docs/handling-touches","docId":"handling-touches","unlisted":false},{"type":"link","label":"使用导航器跳转页面","href":"/docs/navigation","docId":"navigation","unlisted":false},{"type":"link","label":"动画","href":"/docs/animations","docId":"animations","unlisted":false},{"type":"link","label":"手势响应系统","href":"/docs/gesture-responder-system","docId":"gesture-responder-system","unlisted":false}]},{"type":"category","label":"网络连接","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"访问网络","href":"/docs/network","docId":"network","unlisted":false},{"type":"link","label":"网络安全策略","href":"/docs/security","docId":"security","unlisted":false}]},{"type":"category","label":"包容性","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"无障碍功能","href":"/docs/accessibility","docId":"accessibility","unlisted":false}]}],"collapsed":true,"collapsible":true},{"type":"category","label":"调试","items":[{"type":"link","label":"调试","href":"/docs/debugging","docId":"debugging","unlisted":false},{"type":"link","label":"React Native 开发者工具","href":"/docs/react-native-devtools","docId":"react-native-devtools","unlisted":false},{"type":"link","label":"调试原生代码","href":"/docs/debugging-native-code","docId":"debugging-native-code","unlisted":false},{"type":"link","label":"调试发行版本","href":"/docs/debugging-release-builds","docId":"debugging-release-builds","unlisted":false},{"type":"link","label":"其他调试方法","href":"/docs/other-debugging-methods","docId":"other-debugging-methods","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"测试","items":[{"type":"link","label":"Testing","href":"/docs/testing-overview","docId":"testing-overview","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"性能调优","items":[{"type":"link","label":"性能综述","href":"/docs/performance","docId":"performance","unlisted":false},{"type":"link","label":"优化编译速度","href":"/docs/build-speed","docId":"build-speed","unlisted":false},{"type":"link","label":"列表配置优化","href":"/docs/optimizing-flatlist-configuration","docId":"optimizing-flatlist-configuration","unlisted":false},{"type":"link","label":"Optimizing JavaScript loading","href":"/docs/optimizing-javascript-loading","docId":"optimizing-javascript-loading","unlisted":false},{"type":"link","label":"Profiling","href":"/docs/profiling","docId":"profiling","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"JavaScript 运行环境","items":[{"type":"link","label":"JavaScript 环境","href":"/docs/javascript-environment","docId":"javascript-environment","unlisted":false},{"type":"link","label":"定时器","href":"/docs/timers","docId":"timers","unlisted":false},{"type":"link","label":"使用新的 Hermes 引擎","href":"/docs/hermes","docId":"hermes","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"Codegen","items":[{"type":"link","label":"什么是 Codegen?","href":"/docs/the-new-architecture/what-is-codegen","docId":"the-new-architecture/what-is-codegen","unlisted":false},{"type":"link","label":"使用 Codegen","href":"/docs/the-new-architecture/using-codegen","docId":"the-new-architecture/using-codegen","unlisted":false},{"type":"link","label":"Codegen 命令行工具","href":"/docs/the-new-architecture/codegen-cli","docId":"the-new-architecture/codegen-cli","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"原生开发","items":[{"type":"link","label":"桥接原生平台能力","href":"/docs/native-platform","docId":"native-platform","unlisted":false},{"type":"category","label":"原生模块","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"Turbo 原生模块介绍","href":"/docs/turbo-native-modules-introduction","docId":"turbo-native-modules-introduction","unlisted":false},{"type":"link","label":"纯 C++ Turbo 原生模块","href":"/docs/the-new-architecture/pure-cxx-modules","docId":"the-new-architecture/pure-cxx-modules","unlisted":false},{"type":"link","label":"高级:自定义 C++ 类型","href":"/docs/the-new-architecture/custom-cxx-types","docId":"the-new-architecture/custom-cxx-types","unlisted":false}]},{"type":"category","label":"原生 UI 组件","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"Fabric Native Components Introduction","href":"/docs/fabric-native-components-introduction","docId":"fabric-native-components-introduction","unlisted":false}]},{"type":"category","label":"其他","collapsible":true,"collapsed":true,"items":[{"type":"link","label":"附录","href":"/docs/appendix","docId":"appendix","unlisted":false},{"type":"link","label":"创建模块库","href":"/docs/the-new-architecture/create-module-library","docId":"the-new-architecture/create-module-library","unlisted":false}]}],"collapsed":true,"collapsible":true},{"type":"category","label":"Android 与 iOS 指南","items":[{"type":"category","label":"Android","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"Headless JS(后台任务)","href":"/docs/headless-js-android","docId":"headless-js-android","unlisted":false},{"type":"link","label":"打包发布","href":"/docs/signed-apk-android","docId":"signed-apk-android","unlisted":false},{"type":"link","label":"和原生端通信","href":"/docs/communication-android","docId":"communication-android","unlisted":false},{"type":"link","label":"React Native Gradle Plugin","href":"/docs/react-native-gradle-plugin","docId":"react-native-gradle-plugin","unlisted":false}]},{"type":"category","label":"iOS","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"链接原生库","href":"/docs/linking-libraries-ios","docId":"linking-libraries-ios","unlisted":false},{"type":"link","label":"在iOS模拟器上运行","href":"/docs/running-on-simulator-ios","docId":"running-on-simulator-ios","unlisted":false},{"type":"link","label":"和原生端通信","href":"/docs/communication-ios","docId":"communication-ios","unlisted":false},{"type":"link","label":"iOS 应用小组件","href":"/docs/app-extensions","docId":"app-extensions","unlisted":false},{"type":"link","label":"上架 App Store","href":"/docs/publishing-to-app-store","docId":"publishing-to-app-store","unlisted":false}]}],"collapsed":true,"collapsible":true},{"type":"category","label":"旧架构","items":[{"type":"category","label":"原生模块(旧架构)","collapsible":true,"collapsed":true,"items":[{"type":"link","label":"原生模块简介","href":"/docs/legacy/native-modules-intro","docId":"legacy/native-modules-intro","unlisted":false},{"type":"link","label":"Android 原生模块","href":"/docs/legacy/native-modules-android","docId":"legacy/native-modules-android","unlisted":false},{"type":"link","label":"iOS 原生模块","href":"/docs/legacy/native-modules-ios","docId":"legacy/native-modules-ios","unlisted":false},{"type":"link","label":"Native Modules NPM Package Setup","href":"/docs/legacy/native-modules-setup","docId":"legacy/native-modules-setup","unlisted":false},{"type":"link","label":"Local libraries setup","href":"/docs/legacy/local-library-setup","docId":"legacy/local-library-setup","unlisted":false}]},{"type":"category","label":"原生 UI 组件(旧架构)","collapsible":true,"collapsed":true,"items":[{"type":"link","label":"Android 原生UI组件","href":"/docs/legacy/native-components-android","docId":"legacy/native-components-android","unlisted":false},{"type":"link","label":"iOS 原生UI组件","href":"/docs/legacy/native-components-ios","docId":"legacy/native-components-ios","unlisted":false},{"type":"link","label":"直接操作","href":"/docs/legacy/direct-manipulation","docId":"legacy/direct-manipulation","unlisted":false}]}],"collapsed":true,"collapsible":true}],"api":[{"type":"category","label":"APIs","items":[{"type":"link","label":"AccessibilityInfo","href":"/docs/accessibilityinfo","docId":"accessibilityinfo","unlisted":false},{"type":"link","label":"Alert","href":"/docs/alert","docId":"alert","unlisted":false},{"type":"link","label":"Animated","href":"/docs/animated","docId":"animated","unlisted":false},{"type":"link","label":"Animated.Value","href":"/docs/animatedvalue","docId":"animatedvalue","unlisted":false},{"type":"link","label":"Animated.ValueXY","href":"/docs/animatedvaluexy","docId":"animatedvaluexy","unlisted":false},{"type":"link","label":"Appearance","href":"/docs/appearance","docId":"appearance","unlisted":false},{"type":"link","label":"AppRegistry","href":"/docs/appregistry","docId":"appregistry","unlisted":false},{"type":"link","label":"AppState","href":"/docs/appstate","docId":"appstate","unlisted":false},{"type":"link","label":"DevSettings","href":"/docs/devsettings","docId":"devsettings","unlisted":false},{"type":"link","label":"Dimensions","href":"/docs/dimensions","docId":"dimensions","unlisted":false},{"type":"link","label":"Easing","href":"/docs/easing","docId":"easing","unlisted":false},{"type":"link","label":"InteractionManager","href":"/docs/interactionmanager","docId":"interactionmanager","unlisted":false},{"type":"link","label":"Keyboard","href":"/docs/keyboard","docId":"keyboard","unlisted":false},{"type":"link","label":"LayoutAnimation","href":"/docs/layoutanimation","docId":"layoutanimation","unlisted":false},{"type":"link","label":"Linking","href":"/docs/linking","docId":"linking","unlisted":false},{"type":"link","label":"PanResponder","href":"/docs/panresponder","docId":"panresponder","unlisted":false},{"type":"link","label":"PixelRatio","href":"/docs/pixelratio","docId":"pixelratio","unlisted":false},{"type":"link","label":"Platform","href":"/docs/platform","docId":"platform","unlisted":false},{"type":"link","label":"PlatformColor","href":"/docs/platformcolor","docId":"platformcolor","unlisted":false},{"type":"link","label":"RootTag","href":"/docs/roottag","docId":"roottag","unlisted":false},{"type":"link","label":"Share","href":"/docs/share","docId":"share","unlisted":false},{"type":"link","label":"StyleSheet","href":"/docs/stylesheet","docId":"stylesheet","unlisted":false},{"type":"link","label":"Systrace","href":"/docs/systrace","docId":"systrace","unlisted":false},{"type":"link","label":"变换(Transform)","href":"/docs/transforms","docId":"transforms","unlisted":false},{"type":"link","label":"Vibration","href":"/docs/vibration","docId":"vibration","unlisted":false},{"type":"category","label":"Hooks","collapsed":false,"items":[{"type":"link","label":"useColorScheme","href":"/docs/usecolorscheme","docId":"usecolorscheme","unlisted":false},{"type":"link","label":"useWindowDimensions","href":"/docs/usewindowdimensions","docId":"usewindowdimensions","unlisted":false}],"collapsible":true},{"type":"category","label":"Android API","collapsed":false,"items":[{"type":"link","label":"BackHandler","href":"/docs/backhandler","docId":"backhandler","unlisted":false},{"type":"link","label":"PermissionsAndroid","href":"/docs/permissionsandroid","docId":"permissionsandroid","unlisted":false},{"type":"link","label":"ToastAndroid","href":"/docs/toastandroid","docId":"toastandroid","unlisted":false}],"collapsible":true},{"type":"category","label":"iOS API","collapsed":false,"items":[{"type":"link","label":"ActionSheetIOS","href":"/docs/actionsheetios","docId":"actionsheetios","unlisted":false},{"type":"link","label":"DynamicColorIOS","href":"/docs/dynamiccolorios","docId":"dynamiccolorios","unlisted":false},{"type":"link","label":"Settings","href":"/docs/settings","docId":"settings","unlisted":false}],"collapsible":true}],"collapsed":true,"collapsible":true}],"组件":[{"type":"category","label":"核心组件","items":[{"type":"link","label":"核心组件和API","href":"/docs/components-and-apis","docId":"components-and-apis","unlisted":false},{"type":"link","label":"ActivityIndicator","href":"/docs/activityindicator","docId":"activityindicator","unlisted":false},{"type":"link","label":"Button","href":"/docs/button","docId":"button","unlisted":false},{"type":"link","label":"FlatList","href":"/docs/flatlist","docId":"flatlist","unlisted":false},{"type":"link","label":"Image","href":"/docs/image","docId":"image","unlisted":false},{"type":"link","label":"ImageBackground","href":"/docs/imagebackground","docId":"imagebackground","unlisted":false},{"type":"link","label":"KeyboardAvoidingView","href":"/docs/keyboardavoidingview","docId":"keyboardavoidingview","unlisted":false},{"type":"link","label":"Modal","href":"/docs/modal","docId":"modal","unlisted":false},{"type":"link","label":"Pressable","href":"/docs/pressable","docId":"pressable","unlisted":false},{"type":"link","label":"RefreshControl","href":"/docs/refreshcontrol","docId":"refreshcontrol","unlisted":false},{"type":"link","label":"ScrollView","href":"/docs/scrollview","docId":"scrollview","unlisted":false},{"type":"link","label":"SectionList","href":"/docs/sectionlist","docId":"sectionlist","unlisted":false},{"type":"link","label":"StatusBar","href":"/docs/statusbar","docId":"statusbar","unlisted":false},{"type":"link","label":"Switch","href":"/docs/switch","docId":"switch","unlisted":false},{"type":"link","label":"Text","href":"/docs/text","docId":"text","unlisted":false},{"type":"link","label":"TextInput","href":"/docs/textinput","docId":"textinput","unlisted":false},{"type":"link","label":"TouchableHighlight","href":"/docs/touchablehighlight","docId":"touchablehighlight","unlisted":false},{"type":"link","label":"TouchableOpacity","href":"/docs/touchableopacity","docId":"touchableopacity","unlisted":false},{"type":"link","label":"TouchableWithoutFeedback","href":"/docs/touchablewithoutfeedback","docId":"touchablewithoutfeedback","unlisted":false},{"type":"link","label":"View","href":"/docs/view","docId":"view","unlisted":false},{"type":"link","label":"VirtualizedList","href":"/docs/virtualizedlist","docId":"virtualizedlist","unlisted":false},{"type":"category","label":"Android 组件","collapsed":false,"items":[{"type":"link","label":"DrawerLayoutAndroid","href":"/docs/drawerlayoutandroid","docId":"drawerlayoutandroid","unlisted":false},{"type":"link","label":"TouchableNativeFeedback","href":"/docs/touchablenativefeedback","docId":"touchablenativefeedback","unlisted":false}],"collapsible":true},{"type":"category","label":"iOS 组件","collapsed":false,"items":[{"type":"link","label":"InputAccessoryView","href":"/docs/inputaccessoryview","docId":"inputaccessoryview","unlisted":false},{"type":"link","label":"SafeAreaView","href":"/docs/safeareaview","docId":"safeareaview","unlisted":false}],"collapsible":true}],"collapsed":true,"collapsible":true},{"type":"category","label":"Props","items":[{"type":"link","label":"图片样式属性","href":"/docs/image-style-props","docId":"image-style-props","unlisted":false},{"type":"link","label":"布局属性","href":"/docs/layout-props","docId":"layout-props","unlisted":false},{"type":"link","label":"阴影样式属性","href":"/docs/shadow-props","docId":"shadow-props","unlisted":false},{"type":"link","label":"Text 样式属性","href":"/docs/text-style-props","docId":"text-style-props","unlisted":false},{"type":"link","label":"View 样式属性","href":"/docs/view-style-props","docId":"view-style-props","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"内部对象类型","items":[{"type":"link","label":"布局事件对象","href":"/docs/layoutevent","docId":"layoutevent","unlisted":false},{"type":"link","label":"点击事件对象","href":"/docs/pressevent","docId":"pressevent","unlisted":false},{"type":"link","label":"React 节点对象","href":"/docs/react-node","docId":"react-node","unlisted":false},{"type":"link","label":"矩形区域对象","href":"/docs/rect","docId":"rect","unlisted":false},{"type":"link","label":"ViewToken 对象","href":"/docs/viewtoken","docId":"viewtoken","unlisted":false}],"collapsed":true,"collapsible":true}]},"docs":{"accessibility":{"id":"accessibility","title":"无障碍功能","description":"译注:accessibility 一词常见多种译法:可访问性、无障碍性、辅助功能等等,其中文意思都不太能准确表达其功能的本质——即为残障人士提供便利。本文主要采用“无障碍功能”和“辅助技术/服务”的说法。如果你或你的公司暂时没有资源和精力去服务这些用户,那么你可以跳过本文。但是,译者个人希望借本文档,呼吁有能力有资源的商业公司/组织/个人,重视残障人士使用智能手机的权利。","sidebar":"docs"},"accessibilityinfo":{"id":"accessibilityinfo","title":"AccessibilityInfo","description":"有时候我们希望知道用户的设备是否正在运行读屏应用。AccessibilityInfo正是用于此目的。你可以用它来查询读屏应用的当前状态,并且可以监听其状态变化。","sidebar":"api"},"actionsheetios":{"id":"actionsheetios","title":"ActionSheetIOS","description":"显示一个 iOS 原生的Action Sheet组件。","sidebar":"api"},"activityindicator":{"id":"activityindicator","title":"ActivityIndicator","description":"显示一个圆形的 loading 提示符号。","sidebar":"组件"},"alert":{"id":"alert","title":"Alert","description":"启动一个提示对话框,包含对应的标题和信息。","sidebar":"api"},"alertios":{"id":"alertios","title":"AlertIOS","description":"AlertIOS用于弹出一个 iOS 提示对话框,可以通知用户一些信息或是提示用户输入一些文字。"},"animated":{"id":"animated","title":"Animated","description":"Animated库旨在使动画变得流畅,强大并易于构建和维护。Animated侧重于输入和输出之间的声明性关系,以及两者之间的可配置变换,此外还提供了简单的 start/stop方法来控制基于时间的动画执行。","sidebar":"api"},"animatedvalue":{"id":"animatedvalue","title":"Animated.Value","description":"驱动动画的一维标量值. 一个Animated.Value可以同步地驱动多个属性,但每次只能以一种动画机制变化。如果改用了其他动画机制(例如开始一个新的动画或是调用setValue),则会停止先前的动画。","sidebar":"api"},"animatedvaluexy":{"id":"animatedvaluexy","title":"Animated.ValueXY","description":"2D 值用于驱动 2D 动画,例如平移手势。与普通的Animated.Value几乎相同的 API,但是可以多路复用。在内部包含两个常规的Animated.Value。","sidebar":"api"},"animations":{"id":"animations","title":"动画","description":"流畅、有意义的动画对于移动应用用户体验来说是非常重要的。现实生活中的物体在开始移动和停下来的时候都具有一定的惯性,我们在界面中也可以使用动画来实现契合物理规律的交互。","sidebar":"docs"},"app-extensions":{"id":"app-extensions","title":"iOS 应用小组件","description":"小组件允许您在主要应用程序之外提供自定义功能和内容。iOS上有不同类型的应用小组件,它们都在App Extension编程指南中进行了介绍。在本指南中,我们将简要介绍如何在iOS上利用应用小组件的优势。","sidebar":"docs"},"appearance":{"id":"appearance","title":"Appearance","description":"Appearance 模块提供了关于用户外观偏好的信息,例如他们喜欢的颜色方案(明亮或暗黑)。","sidebar":"api"},"appendix":{"id":"appendix","title":"附录","description":"一、术语","sidebar":"docs"},"appregistry":{"id":"appregistry","title":"AppRegistry","description":"仅适用于非沙盒项目","sidebar":"api"},"appstate":{"id":"appstate","title":"AppState","description":"AppState能告诉你应用当前是在前台还是在后台,并且能在状态变化的时候通知你。","sidebar":"api"},"architecture-glossary":{"id":"architecture-glossary","title":"术语表","description":"Fabric 渲染器(Fabric Renderer)"},"architecture-overview":{"id":"architecture-overview","title":"架构概览","description":"本文档还在持续更新中,会从概念上介绍 React Native 新架构是如何工作的。目标读者包括生态库的开发者、核心贡献者和特别有好奇心的人。"},"asyncstorage":{"id":"asyncstorage","title":"🚧 AsyncStorage","description":"已过时。 Use one of the community packages instead."},"backhandler":{"id":"backhandler","title":"BackHandler","description":"BackHandler API 用于监听设备上的后退按钮事件,可以调用你自己的函数来处理后退行为。此 API 仅能在 Android 上使用。","sidebar":"api"},"build-speed":{"id":"build-speed","title":"优化编译速度","description":"构建 React Native 应用可能会非常昂贵,并且需要开发人员花费数分钟的时间。","sidebar":"docs"},"building-for-tv":{"id":"building-for-tv","title":"为电视和机顶盒制作应用","description":"目前的 React Native 应用只需在 JavaScript 端简单修改甚至无需修改,在电视和机顶盒设备上就基本可用了。","sidebar":"docs"},"button":{"id":"button","title":"Button","description":"一个简单的跨平台的按钮组件。可以进行一些简单的定制。","sidebar":"组件"},"checkbox":{"id":"checkbox","title":"🚧 CheckBox","description":"Removed. Use one of the community packages instead."},"clipboard":{"id":"clipboard","title":"🚧 Clipboard","description":"Deprecated. Use one of the community packages instead."},"colors":{"id":"colors","title":"颜色","description":"React Native 中的组件是使用 JavaScript 进行样式化的。颜色属性通常与 Web 上的 CSS 工作方式相匹配。每个平台上关于颜色使用的一般指南如下:","sidebar":"docs"},"communication-android":{"id":"communication-android","title":"和原生端通信","description":"通过植入原生应用和原生 UI 组件两篇文档,我们学习了 React Native 和原生组件的互相整合。在整合的过程中,我们会需要在两个世界间互相通信。有些方法已经在其他的指南中提到了,这篇文章总结了所有可行的技术。","sidebar":"docs"},"communication-ios":{"id":"communication-ios","title":"和原生端通信","description":"通过植入原生应用和原生 UI 组件两篇文档,我们学习了 React Native 和原生组件的互相整合。在整合的过程中,我们会需要在两个世界间互相通信。有些方法已经在其他的指南中提到了,这篇文章总结了所有可行的技术。","sidebar":"docs"},"components-and-apis":{"id":"components-and-apis","title":"核心组件和API","description":"React Native 提供了一些内置的核心组件供你使用。你可以在网站的左侧看到组件的完整列表。如果你不知道从哪看起,那么可以先看一下下面这个简单的分类:","sidebar":"组件"},"custom-webview-android":{"id":"custom-webview-android","title":"Custom WebView","description":"While the built-in web view has a lot of features, it is not possible to handle every use-case in React Native. You can, however, extend the web view with native code without forking React Native or duplicating all the existing web view code."},"custom-webview-ios":{"id":"custom-webview-ios","title":"Custom WebView","description":"While the built-in web view has a lot of features, it is not possible to handle every use-case in React Native. You can, however, extend the web view with native code without forking React Native or duplicating all the existing web view code."},"datepickerandroid":{"id":"datepickerandroid","title":"🚧 DatePickerAndroid","description":"Deprecated. Use one of the community packages instead."},"datepickerios":{"id":"datepickerios","title":"🚧 DatePickerIOS","description":"Deprecated. Use one of the community packages instead."},"debugging":{"id":"debugging","title":"调试","description":"访问 App 内的开发菜单","sidebar":"docs"},"debugging-native-code":{"id":"debugging-native-code","title":"调试原生代码","description":"仅限包含原生代码的项目","sidebar":"docs"},"debugging-release-builds":{"id":"debugging-release-builds","title":"调试发行版本","description":"符号化堆栈跟踪","sidebar":"docs"},"devsettings":{"id":"devsettings","title":"DevSettings","description":"DevSettings 模块可以对开发者菜单进行一些自定义。","sidebar":"api"},"dimensions":{"id":"dimensions","title":"Dimensions","description":"本模块用于获取设备屏幕的宽高。","sidebar":"api"},"drawerlayoutandroid":{"id":"drawerlayoutandroid","title":"DrawerLayoutAndroid","description":"封装了 Android 平台DrawerLayout的 React 组件。抽屉(通常用于导航切换)是通过renderNavigationView方法渲染的,并且 DrawerLayoutAndroid 的直接子视图会成为主视图(用于放置内容)。导航视图一开始在屏幕上并不可见,不过可以从drawerPosition指定的窗口侧面拖拽出来,并且抽屉的宽度可以使用drawerWidth属性来指定。","sidebar":"组件"},"dynamiccolorios":{"id":"dynamiccolorios","title":"DynamicColorIOS","description":"DynamicColorIOS函数是专门针对iOS平台的颜色类型。","sidebar":"api"},"easing":{"id":"easing","title":"Easing","description":"Easing模块实现了常见的动画缓动函数。 这个模块被Animated.timing()用于在动画中传达真实可信的运动。","sidebar":"api"},"environment-setup":{"id":"environment-setup","title":"搭建开发环境","description":"欢迎使用 React Native!这篇文档会帮助你搭建基本的 React Native 开发环境。","sidebar":"docs"},"fabric-native-components-android":{"id":"fabric-native-components-android","title":"Fabric Native Modules: Android","description":"现在,是时候编写一些 Android 平台代码,以便能够渲染 web 视图。以下是需要的步骤:"},"fabric-native-components-introduction":{"id":"fabric-native-components-introduction","title":"Fabric Native Components Introduction","description":"如果你想构建一个 新架构 的 React Native 组件,该组件可以包装一个 Host Component,例如 Android 上的 CheckBox,或者 iOS 上的 UIButton,你应该使用 Fabric 原生组件。","sidebar":"docs"},"fabric-native-components-ios":{"id":"fabric-native-components-ios","title":"Fabric Native Components: iOS","description":"现在,是时候编写一些 iOS 平台代码,以便能够渲染 web 视图。以下是需要的步骤:"},"fabric-renderer":{"id":"fabric-renderer","title":"Fabric 渲染器","description":"Fabric 是 React Native 新架构的渲染系统,是从老架构的渲染系统演变而来的。核心原理是在 C++ 层统一更多的渲染逻辑,提升与宿主平台(host platforms)互操作性,并为 React Native 解锁更多能力。其研发始于 2018 年。从 2021 年开始, Facebook App 中的 React Native 启用了新的渲染器。"},"fast-refresh":{"id":"fast-refresh","title":"快速刷新","description":"快速刷新是 React Native 一个特性,在修改组件的时候快速刷新会给你一个即时的反馈。快速刷新默认是开启的,可以通过调整 React Native 开发者菜单里面的 \\"Enable Fast Refresh\\" 来开启或关闭。在快速刷新开启的时候,大多数的修改能在一到两秒之内呈现。","sidebar":"docs"},"flatlist":{"id":"flatlist","title":"FlatList","description":"高性能的简单列表组件,支持下面这些常用的功能:","sidebar":"组件"},"flexbox":{"id":"flexbox","title":"使用 Flexbox 布局","description":"我们在 React Native 中使用 flexbox 规则来指定某个组件的子元素的布局。Flexbox 可以在不同屏幕尺寸上提供一致的布局结构。","sidebar":"docs"},"gesture-responder-system":{"id":"gesture-responder-system","title":"手势响应系统","description":"移动设备上的手势识别要比在 web 上复杂得多。用户的一次触摸操作的真实意图是什么,App 要经过好几个阶段才能判断。比如 App 需要判断用户的触摸到底是在滚动页面,还是滑动一个 widget,或者只是一个单纯的点击。甚至随着持续时间的不同,这些操作还会转化。此外,还有多点同时触控的情况。","sidebar":"docs"},"getting-started":{"id":"getting-started","title":"简介","description":"欢迎开启 React Native 的旅程!如果你在找如何搭建环境的文档,请移步搭建开发环境。 继续往下阅读可了解关于文档结构、原生组件、React等相关的一些介绍。","sidebar":"docs"},"handling-text-input":{"id":"handling-text-input","title":"处理文本输入","description":"TextInput是一个允许用户输入文本的基础组件。它有一个名为onChangeText的属性,此属性接受一个函数,而此函数会在文本变化时被调用。另外还有一个名为onSubmitEditing的属性,会在文本被提交后(用户按下软键盘上的提交键)调用。","sidebar":"docs"},"handling-touches":{"id":"handling-touches","title":"处理触摸事件","description":"移动应用上的用户交互基本靠“摸”。当然,“摸”也是有各种姿势的:在一个按钮上点击,在一个列表上滑动,或是在一个地图上缩放。React Native 提供了可以处理常见触摸手势(例如点击或滑动)的组件, 以及可用于识别更复杂的手势的完整的手势响应系统。","sidebar":"docs"},"headless-js-android":{"id":"headless-js-android","title":"Headless JS(后台任务)","description":"Headless JS 是一种使用 js 在后台执行任务的方法。它可以用来在后台同步数据、处理推送通知或是播放音乐等等。","sidebar":"docs"},"height-and-width":{"id":"height-and-width","title":"高度与宽度","description":"组件的高度和宽度决定了其在屏幕上显示的尺寸。","sidebar":"docs"},"hermes":{"id":"hermes","title":"使用新的 Hermes 引擎","description":"Hermes 是专门针对 React Native 应用而优化的全新开源 JavaScript 引擎。对于很多应用来说,启用 Hermes 引擎可以优化启动时间,减少内存占用以及空间占用。从 React Native 0.70 版本开始 Hermes 已经默认启用,无需开发者再做任何配置。","sidebar":"docs"},"image":{"id":"image","title":"Image","description":"用于显示多种不同类型图片的 React 组件,包括网络图片、静态资源、临时的本地图片、以及本地磁盘上的图片(如相册)等。","sidebar":"组件"},"image-style-props":{"id":"image-style-props","title":"图片样式属性","description":"示例","sidebar":"组件"},"imagebackground":{"id":"imagebackground","title":"ImageBackground","description":"对于熟悉 Web 开发的开发人员来说,background-image是一个常见的功能请求。为了处理这种情况,您可以使用`组件,它具有与`相同的属性,并且可以添加任何子元素以覆盖在其上面。","sidebar":"组件"},"imagepickerios":{"id":"imagepickerios","title":"🚧 ImagePickerIOS","description":"Deprecated. Use one of the community packages instead."},"images":{"id":"images","title":"图片","description":"静态图片资源","sidebar":"docs"},"improvingux":{"id":"improvingux","title":"改进用户体验","description":"配置文本输入"},"inputaccessoryview":{"id":"inputaccessoryview","title":"InputAccessoryView","description":"一个可以在iOS上自定义键盘输入辅助视图的组件。当TextInput获得焦点时,输入辅助视图显示在键盘上方。该组件可用于创建自定义工具栏。","sidebar":"组件"},"integration-with-android-fragment":{"id":"integration-with-android-fragment","title":"集成到 Android Fragment","description":"与现有应用程序集成指南中详细介绍了如何将全屏 React Native 应用程序作为 Activity 集成到现有 Android 应用程序中。要在现有应用程序的 Fragments 中使用 React Native 组件,需要进行一些额外的设置。这样做的好处是它允许原生应用程序将 React Native 组件与 Activity 中的原生 Fragments 集成在一起。","sidebar":"docs"},"integration-with-existing-apps":{"id":"integration-with-existing-apps","title":"集成到现有原生应用","description":"如果你正准备从头开始制作一个新的应用,那么 React Native 会是个非常好的选择。但如果你只想给现有的原生应用中添加一两个视图或是业务流程,React Native 也同样不在话下。只需简单几步,你就可以给原有应用加上新的基于 React Native 的特性、画面和视图等。","sidebar":"docs"},"interactionmanager":{"id":"interactionmanager","title":"InteractionManager","description":"Interactionmanager 可以将一些耗时较长的工作安排到所有互动或动画完成之后再进行。这样可以保证 JavaScript 动画的流畅运行。","sidebar":"api"},"intro-react":{"id":"intro-react","title":"React 基础","description":"要深入理解 React Native,需要扎实的React 基础知识。这篇小教程可以帮助你入门或者温习相关知识。","sidebar":"docs"},"intro-react-native-components":{"id":"intro-react-native-components","title":"核心组件与原生组件","description":"React Native 使用完全原生的组件来构建应用界面。尤其方便的是它已经内置了大量直接上手可用的核心组件。","sidebar":"docs"},"javascript-environment":{"id":"javascript-environment","title":"JavaScript 环境","description":"JavaScript 运行时环境","sidebar":"docs"},"keyboard":{"id":"keyboard","title":"Keyboard","description":"Keyboard模块用来控制键盘相关的事件。","sidebar":"api"},"keyboardavoidingview":{"id":"keyboardavoidingview","title":"KeyboardAvoidingView","description":"本组件用于解决一个常见的尴尬问题:手机上弹出的键盘常常会挡住当前的视图。本组件可以自动根据键盘的高度,调整自身的 height 或底部的 padding,以避免被遮挡。","sidebar":"组件"},"layout-props":{"id":"layout-props","title":"布局属性","description":"更多关于这些属性的详细示例可以在Flexbox 布局页面上找到。","sidebar":"组件"},"layoutanimation":{"id":"layoutanimation","title":"LayoutAnimation","description":"当布局变化时,自动将视图运动到它们新的位置上。","sidebar":"api"},"layoutevent":{"id":"layoutevent","title":"布局事件对象","description":"LayoutEvent object is returned in the callback as a result of component layout change, for example onLayout in View component.","sidebar":"组件"},"legacy/direct-manipulation":{"id":"legacy/direct-manipulation","title":"直接操作","description":"有时候我们需要直接改动组件并触发局部的刷新,但不使用 state 或是 props。譬如在浏览器中使用 React 库,有时候会需要直接修改一个 DOM 节点,而在手机 App 中操作 View 时也会碰到同样的情况。在 React Native 中,setNativeProps就是等价于直接操作 DOM 节点的方法。","sidebar":"docs"},"legacy/local-library-setup":{"id":"legacy/local-library-setup","title":"Local libraries setup","description":"A local library is a library containing views or modules that\'s local to your app and not published to a registry. This is different from the traditional setup for view and modules in the sense that a local library is decoupled from your app\'s native code.","sidebar":"docs"},"legacy/native-components-android":{"id":"legacy/native-components-android","title":"Android 原生UI组件","description":"在如今的 App 中,已经有成千上万的原生 UI 部件了——其中的一些是平台的一部分,另一些可能来自于一些第三方库,而且可能你自己还收藏了很多。React Native 已经封装了大部分最常见的组件,譬如ScrollView和TextInput,但不可能封装全部组件。而且,说不定你曾经为自己以前的 App 还封装过一些组件,React Native 肯定没法包含它们。幸运的是,在 React Naitve 应用程序中封装和植入已有的组件非常简单。","sidebar":"docs"},"legacy/native-components-ios":{"id":"legacy/native-components-ios","title":"iOS 原生UI组件","description":"在如今的 App 中,已经有成千上万的原生 UI 部件了——其中的一些是平台的一部分,另一些可能来自于一些第三方库,而且可能你自己还收藏了很多。React Native 已经封装了大部分最常见的组件,譬如ScrollView和TextInput,但不可能封装全部组件。而且,说不定你曾经为自己以前的 App 还封装过一些组件,React Native 肯定没法包含它们。幸运的是,在 React Naitve 应用程序中封装和植入已有的组件非常简单。","sidebar":"docs"},"legacy/native-modules-android":{"id":"legacy/native-modules-android","title":"Android 原生模块","description":"欢迎来到 Android 的原生模块。请先阅读 原生模块简介 以了解原生模块的基本概念。","sidebar":"docs"},"legacy/native-modules-intro":{"id":"legacy/native-modules-intro","title":"原生模块简介","description":"有时候 App 需要访问平台 API,但 React Native 可能还没有相应的模块包装;或者你需要复用一些 Java 代码,而不是用 Javascript 重新实现一遍;又或者你需要实现某些高性能的、多线程的代码,譬如图片处理、数据库、或者各种高级扩展等等。","sidebar":"docs"},"legacy/native-modules-ios":{"id":"legacy/native-modules-ios","title":"iOS 原生模块","description":"有时候 App 需要访问平台 API,但 React Native 可能还没有相应的模块封装;或者你需要复用 Objective-C、Swift 或 C++代码,而不是用 JavaScript 重新实现一遍;又或者你需要实现某些高性能、多线程的代码,譬如图片处理、数据库、或者各种高级扩展等等。","sidebar":"docs"},"legacy/native-modules-setup":{"id":"legacy/native-modules-setup","title":"Native Modules NPM Package Setup","description":"Native modules are usually distributed as npm packages, except that on top of the usual JavaScript they will include some native code per platform. To understand more about npm packages you may find this guide useful.","sidebar":"docs"},"libraries":{"id":"libraries","title":"使用第三方库","description":"This guide introduces React Native developers to finding, installing, and using third-party libraries in their apps.","sidebar":"docs"},"linking":{"id":"linking","title":"Linking","description":"Linking提供了一个通用的接口来与传入和传出的 App 链接进行交互。","sidebar":"api"},"linking-libraries-ios":{"id":"linking-libraries-ios","title":"链接原生库","description":"并不是所有的 APP 都需要使用全部的原生功能,包含支持全部特性的代码会增大应用的体积。但我们仍然希望能让你简单地根据自己的需求添加需要的特性。","sidebar":"docs"},"metro":{"id":"metro","title":"Metro","description":"React Native 使用Metro构建 JavaScript 代码和资源。","sidebar":"docs"},"modal":{"id":"modal","title":"Modal","description":"Modal 组件是一种简单的覆盖在其他视图之上显示内容的方式。","sidebar":"组件"},"more-resources":{"id":"more-resources","title":"其他参考资源","description":"如果你耐心的读完并理解了本网站上的所有文档,那么你应该已经可以编写一个像样的 React Native 应用了。但是 React Native 并不全是某一家公司的作品——它汇聚了成千上万开源社区开发者的智慧结晶。如果你想深入研究 React Native,那么建议不要错过下面这些参考资源。","sidebar":"docs"},"native-platform":{"id":"native-platform","title":"桥接原生平台能力","description":"你的应用可能需要访问 React Native 或社区维护的数百个 第三方库 中未直接提供的平台功能。也许你想要重用一些现有的 Objective-C、Swift、Java、Kotlin 或 C++ 代码。无论你的原因是什么,React Native 都提供了一组强大的 API 来连接你的原生代码和 JavaScript 应用代码。","sidebar":"docs"},"navigation":{"id":"navigation","title":"使用导航器跳转页面","description":"移动应用基本不会只由一个页面组成。管理多个页面的呈现、跳转的组件就是我们通常所说的导航器(navigator)。","sidebar":"docs"},"netinfo":{"id":"netinfo","title":"NetInfo","description":"已过时。 Use react-native-community/react-native-netinfo instead."},"network":{"id":"network","title":"访问网络","description":"很多移动应用都需要从远程地址中获取数据或资源。你可能需要给某个 REST API 发起 POST 请求以提交用户数据,又或者可能仅仅需要从某个服务器上获取一些静态内容——以下就是你会用到的东西。新手可以对照这个简短的视频教程加深理解。","sidebar":"docs"},"new-architecture-app-intro":{"id":"new-architecture-app-intro","title":"在应用中启用的预备工作","description":"在启用新架构之前,应先满足一些先决条件。"},"new-architecture-app-modules-ios":{"id":"new-architecture-app-modules-ios","title":"在 iOS 上启用 TurboModule","description":"Make sure your application meets all the prerequisites."},"new-architecture-app-renderer-android":{"id":"new-architecture-app-renderer-android","title":"在 Android 上启用 Fabric","description":"Make sure your application meets all the prerequisites."},"new-architecture-app-renderer-ios":{"id":"new-architecture-app-renderer-ios","title":"在 iOS 上启用 Fabric","description":"This section will go over how to enable the new renderer in your app. Make sure your application meets all the prerequisites."},"new-architecture-intro":{"id":"new-architecture-intro","title":"迁移到新架构","description":"此迁移指南旨在为React Native的库作者和应用程序开发者提供。它概述了您需要遵循的步骤,以在您的Android和iOS库和应用中使用由新的NativeModule系统(TurboModule)和新的渲染器(Fabric)组成的新架构。"},"new-architecture-library-android":{"id":"new-architecture-library-android","title":"在 Android 库中启用","description":"一旦您在先决条件中定义了本机模块的 JavaScript 规范,设置了 CodeGen 配置,并遵循了 Android/Gradle 设置,然后就可以将您的库迁移到新架构。以下是迁移所需的步骤。"},"new-architecture-library-intro":{"id":"new-architecture-library-intro","title":"在库中启用的预备工作","description":"The following steps will help ensure your modules and components are ready for the New Architecture."},"new-architecture-library-ios":{"id":"new-architecture-library-ios","title":"在 iOS 库中启用","description":"You have defined the JavaScript specs for your native modules as part of the prerequisites, and you are now ready to migrate your library to the New Architecture. Here are the steps you can follow to accomplish this."},"new-architecture-troubleshooting":{"id":"new-architecture-troubleshooting","title":"常见问题","description":"本页面会记录一些迁移到新架构时可能遇到的常见问题的解决方案。"},"new-architecture-turbo-modules":{"id":"new-architecture-turbo-modules","title":"新架构的原生模块(Turbo Module)","description":"If you\'ve worked with React Native, you may be familiar with the concept of Native Modules, which allow JavaScript and platform-native code to communicate over the React Native \\"bridge\\", which handles cross-platform serialization via JSON."},"optimizing-flatlist-configuration":{"id":"optimizing-flatlist-configuration","title":"列表配置优化","description":"术语定义","sidebar":"docs"},"optimizing-javascript-loading":{"id":"optimizing-javascript-loading","title":"Optimizing JavaScript loading","description":"解析和运行 JavaScript 代码需要内存和时间。因此,随着你的应用程序增长,通常将代码加载延迟到首次需要时是有用的。React Native 自带一些默认开启的标准优化,并且你可以在自己的代码中采用一些技术来帮助 React 更有效地加载你的应用程序。还有一些适合非常大应用程序的高级自动优化(它们也有自己的权衡)。","sidebar":"docs"},"other-debugging-methods":{"id":"other-debugging-methods","title":"其他调试方法","description":"此页面介绍了除 打开调试器 中描述的方法之外的其他 JavaScript 调试方法。如果你正在使用新创建的 React Native 或 Expo 应用,我们建议从那里开始。","sidebar":"docs"},"out-of-tree-platforms":{"id":"out-of-tree-platforms","title":"多平台支持","description":"React Native不仅适用于 Android 和 iOS - 还有社区支持的项目将其应用于其他平台,例如:","sidebar":"docs"},"panresponder":{"id":"panresponder","title":"PanResponder","description":"PanResponder类可以将多点触摸操作协调成一个手势。它使得一个单点触摸可以接受更多的触摸操作,也可以用于识别简单的多点触摸手势。","sidebar":"api"},"performance":{"id":"performance","title":"性能综述","description":"使用 React Native 替代基于 WebView 的框架来开发 App 的一个强有力的理由,就是为了使 App 可以达到每秒 60 帧(足够流畅),并且能有类似原生 App 的外观和手感。因此我们也尽可能地优化 React Native 去实现这一目标,使开发者能集中精力处理 App 的业务逻辑,而不用费心考虑性能。但是,总还是有一些地方有所欠缺,以及在某些场合 React Native 还不能够替你决定如何进行优化(用原生代码写也无法避免),因此人工的干预依然是必要的。","sidebar":"docs"},"permissionsandroid":{"id":"permissionsandroid","title":"PermissionsAndroid","description":"仅适用于非沙盒项目","sidebar":"api"},"pixelratio":{"id":"pixelratio","title":"PixelRatio","description":"PixelRatio 可以获取到设备的像素密度和字体缩放比。","sidebar":"api"},"platform":{"id":"platform","title":"Platform","description":"Example","sidebar":"api"},"platform-specific-code":{"id":"platform-specific-code","title":"特定平台代码","description":"在编写跨平台的应用时,我们肯定希望尽可能多地复用代码。但是总有些时候我们会碰到针对不同平台编写不同代码的需求。","sidebar":"docs"},"platformcolor":{"id":"platformcolor","title":"PlatformColor","description":"You can use the PlatformColor function to access native colors on the target platform by supplying the native color’s corresponding string value. You pass a string to the PlatformColor function and, provided it exists on that platform, it will return the corresponding native color, which you can apply in any part of your application.","sidebar":"api"},"pressable":{"id":"pressable","title":"Pressable","description":"Pressable 是一个核心组件的封装,它可以检测到任意子组件的不同阶段的按压交互情况。","sidebar":"组件"},"pressevent":{"id":"pressevent","title":"点击事件对象","description":"点击事件对象作为用户按压交互的结果在回调中返回,例如 Button 组件中的 onPress。","sidebar":"组件"},"profile-hermes":{"id":"profile-hermes","title":"在 Hermes 中进行性能分析","description":"你可以使用Hermes在 React Native 应用中可视化 JavaScript 的性能。Hermes 是一个小型且轻量的 JavaScript 引擎(你可以在这里阅读更多有关在 React Native 中使用它的信息)。Hermes 有助于提高应用性能,并且还提供了分析其运行的 JavaScript 性能的方式。"},"profiling":{"id":"profiling","title":"Profiling","description":"使用内置的性能分析器获取 JavaScript 线程和主线程并排的详细工作信息。从调试菜单中选择 Perf Monitor 即可访问它。","sidebar":"docs"},"progressbarandroid":{"id":"progressbarandroid","title":"🚧 ProgressBarAndroid","description":"已过时。 Use @react-native-community/progress-bar-android instead."},"progressviewios":{"id":"progressviewios","title":"🚧 ProgressViewIOS","description":"已过时。 Use @react-native-community/progress-view instead."},"props":{"id":"props","title":"Props(属性)","description":"大多数组件在创建时就可以使用各种参数来进行定制。用于定制的这些参数就称为props(属性)。"},"publishing-to-app-store":{"id":"publishing-to-app-store","title":"上架 App Store","description":"上架应用的过程和任何其它原生 iOS 应用一样,但有一些额外的注意事项要考虑。","sidebar":"docs"},"pushnotificationios":{"id":"pushnotificationios","title":"🚧 PushNotificationIOS","description":"已过时。 Use @react-native-community/push-notification-ios instead."},"ram-bundles-inline-requires":{"id":"ram-bundles-inline-requires","title":"RAM Bundles 和内联引用优化","description":"如果你有一个较为庞大的应用程序,你可能要考虑使用RAM(Random Access Modules,随机存取模块)格式的 bundle 和内联引用。这对于具有大量页面的应用程序是非常有用的,这些页面在应用程序的典型使用过程中可能不会被打开。通常对于启动后一段时间内不需要大量代码的应用程序来说是非常有用的。例如应用程序包含复杂的配置文件屏幕或较少使用的功能,但大多数会话只涉及访问应用程序的主屏幕更新。我们可以通过使用RAM格式来优化bundle的加载,并且内联引用这些功能和页面(当它们被实际使用时)。"},"react-18-and-react-native":{"id":"react-18-and-react-native","title":"React 18 与 React Native","description":"这个页面描述了如何在 React Native 的新架构中启用 React 18 版本。"},"react-native-devtools":{"id":"react-native-devtools","title":"React Native 开发者工具","description":"React Native DevTools 是我们新的调试体验,它对我们的调试堆栈进行了端到端的重新编写。它旨在比以前的调试方法更深入地集成,并且从根本上更可靠。","sidebar":"docs"},"react-native-gradle-plugin":{"id":"react-native-gradle-plugin","title":"React Native Gradle Plugin","description":"本指南描述了如何配置 React Native Gradle Plugin(通常称为 RNGP)来为 Android 构建 React Native 应用。","sidebar":"docs"},"react-node":{"id":"react-node","title":"React 节点对象","description":"React 节点对象有以下这些类型:","sidebar":"组件"},"rect":{"id":"rect","title":"矩形区域对象","description":"Rect 接受数值像素值来描述如何扩展矩形区域。这些值会被添加到原始区域的大小上以扩展它。","sidebar":"组件"},"rectorsize":{"id":"rectorsize","title":"RectOrSize Object Type","description":"RectOrSize接受数字像素值来描述如何扩展矩形区域。这些值会被添加到原始区域的大小上以扩展它。"},"refreshcontrol":{"id":"refreshcontrol","title":"RefreshControl","description":"这一组件可以用在 ScrollView 或 FlatList 内部,为其添加下拉刷新的功能。当 ScrollView 处于竖直方向的起点位置(scrollY: 0),此时下拉会触发一个onRefresh事件。","sidebar":"组件"},"removing-default-permissions":{"id":"removing-default-permissions","title":"移除不需要的权限","description":"默认情况下我们会给最终打包的 APK 加入一些权限申请,具体如下:"},"render-pipeline":{"id":"render-pipeline","title":"渲染,提交与挂载(渲染流水线)","description":"文档介绍了即将发布的新渲染器 Fabric 的架构。"},"roottag":{"id":"roottag","title":"RootTag","description":"RootTag 是用于标记 React Native 原生根视图层的不透明标识符(opaque identifier)。具体来说就是 ReactRootView(android) 或是 RCTRootView(iOS) 的实例 ID.","sidebar":"api"},"running-on-device":{"id":"running-on-device","title":"在设备上运行","description":"在真机上仔细测试 app 后再发布给用户总是不会错的。本文档将指导你通过必须的步骤在设备上运行 React Native app,为生产做准备。","sidebar":"docs"},"running-on-simulator-ios":{"id":"running-on-simulator-ios","title":"在iOS模拟器上运行","description":"启动模拟器","sidebar":"docs"},"safeareaview":{"id":"safeareaview","title":"SafeAreaView","description":"SafeAreaView的目的是在一个“安全”的可视区域内渲染内容。具体来说就是因为目前有 iPhone X 这样的带有“刘海”的全面屏设备,所以需要避免内容渲染到不可见的“刘海”范围内。本组件目前仅支持 iOS 设备以及 iOS 11 或更高版本。","sidebar":"组件"},"sample-application-movies":{"id":"sample-application-movies","title":"示例教程:电影列表","description":"简介"},"scrollview":{"id":"scrollview","title":"ScrollView","description":"一个封装了平台的 ScrollView(滚动视图)的组件,同时还集成了触摸锁定的“响应者”系统。","sidebar":"组件"},"sectionlist":{"id":"sectionlist","title":"SectionList","description":"高性能的分组(section)列表组件,支持下面这些常用的功能:","sidebar":"组件"},"security":{"id":"security","title":"网络安全策略","description":"开发应用时安全常常是一个被忽视的话题。的确,搭建一个完全无懈可击的软件是不可能的——我们还没有发明一个完全坚不可摧的锁(毕竟,银行金库已经足够坚固但仍然会被闯入)。然而,遭受恶意攻击或暴露安全漏洞的可能性与您愿意投入保护应用程序免受此类事件的努力成反比。尽管普通的挂锁可以被撬开,但它仍然比橱柜挂钩更难攻破!","sidebar":"docs"},"segmentedcontrolios":{"id":"segmentedcontrolios","title":"🚧 SegmentedControlIOS","description":"已过时。 Use @react-native-community/segmented-control instead."},"settings":{"id":"settings","title":"Settings","description":"Settings是对NSUserDefaults的封装。它是iOS平台上的一种持久的键值对存储。","sidebar":"api"},"shadow-props":{"id":"shadow-props","title":"阴影样式属性","description":"These properties are iOS only - for similar functionality on Android, use the elevation property.","sidebar":"组件"},"share":{"id":"share","title":"Share","description":"示例","sidebar":"api"},"signed-apk-android":{"id":"signed-apk-android","title":"打包发布","description":"Android 要求所有应用都有一个数字签名才会被允许安装在用户手机上,所以在把应用发布到应用市场之前,你需要先生成一个签名的 AAB 或 APK 包(Google Play 现在要求 AAB 格式,而国内的应用市场目前仅支持 APK 格式。但无论哪种格式,下面的签名步骤是一样的)。Android 开发者官网上的如何给你的应用签名文档描述了签名的细节。本指南旨在提供一个简化的签名和打包的操作步骤,不会涉及太多理论。","sidebar":"docs"},"slider":{"id":"slider","title":"🚧 Slider","description":"已过时。 Use @react-native-community/slider instead."},"speeding-ci-builds":{"id":"speeding-ci-builds","title":"优化 CI 构建","description":"You or your company may have set up a Continuous Integration (CI) environment to test your React Native application."},"state":{"id":"state","title":"State(状态)","description":"我们使用两种数据来控制一个组件:props和state。props是在父组件中指定,而且一经指定,在被指定的组件的生命周期中则不再改变。对于需要改变的数据,我们需要使用state。"},"statusbar":{"id":"statusbar","title":"StatusBar","description":"控制应用状态栏的组件。","sidebar":"组件"},"style":{"id":"style","title":"样式","description":"在 React Native 中,你并不需要学习什么特殊的语法来定义样式。我们仍然是使用 JavaScript 来写样式。所有的核心组件都接受名为style的属性。这些样式名基本上是遵循了 web 上的 CSS 的命名,只是按照 JS 的语法要求使用了驼峰命名法,例如将background-color改为backgroundColor。","sidebar":"docs"},"stylesheet":{"id":"stylesheet","title":"StyleSheet","description":"StyleSheet 提供了一种类似 CSS 样式表的抽象。","sidebar":"api"},"switch":{"id":"switch","title":"Switch","description":"跨平台通用的“开关”组件。","sidebar":"组件"},"symbolication":{"id":"symbolication","title":"Symbolicating a stack trace","description":"If a React Native app throws an unhandled exception in a release build, the output may be obfuscated and hard to read:"},"systrace":{"id":"systrace","title":"Systrace","description":"Systrace is a standard Android marker-based profiling tool (and is installed when you install the Android platform-tools package). Profiled code blocks are surrounded by start/end markers which are then visualized in a colorful chart format. Both the Android SDK and React Native framework provide standard markers that you can visualize.","sidebar":"api"},"testing-overview":{"id":"testing-overview","title":"Testing","description":"This guide introduces React Native developers to the key concepts behind testing, how to write good tests, and what kinds of tests you can incorporate into your workflow.","sidebar":"docs"},"text":{"id":"text","title":"Text","description":"一个用于显示文本的 React 组件,并且它也支持嵌套、样式,以及触摸处理。","sidebar":"组件"},"text-style-props":{"id":"text-style-props","title":"Text 样式属性","description":"示例","sidebar":"组件"},"textinput":{"id":"textinput","title":"TextInput","description":"TextInput 是一个允许用户在应用中通过键盘输入文本的基本组件。本组件的属性提供了多种特性的配置,譬如自动完成、自动大小写、占位文字,以及多种不同的键盘类型(如纯数字键盘)等等。","sidebar":"组件"},"the-new-architecture/backward-compatibility":{"id":"the-new-architecture/backward-compatibility","title":"向后兼容的意义","description":"创建一个向后兼容的模块很重要,这样可以实现在旧架构和新架构中都能工作的库。并不是所有用户都会立刻转到新架构,最好在他们使用旧架构时仍然保持兼容。"},"the-new-architecture/backward-compatibility-fabric-components":{"id":"the-new-architecture/backward-compatibility-fabric-components","title":"使 Fabric 组件与传统原生组件兼容","description":"创建向后兼容的 Fabric 原生组件需要了解如何创建传统的原生组件。要回忆这些概念,请查看此指南。"},"the-new-architecture/backward-compatibility-turbomodules":{"id":"the-new-architecture/backward-compatibility-turbomodules","title":"使 Turbo 模块与传统原生模块兼容","description":"创建向后兼容的 Turbo 原生模块需要了解如何创建传统的原生模块。要回忆这些概念,请查看此指南。"},"the-new-architecture/codegen-cli":{"id":"the-new-architecture/codegen-cli","title":"Codegen 命令行工具","description":"调用 Gradle 或手动调用脚本可能很难记住,并且需要很多步骤。","sidebar":"docs"},"the-new-architecture/create-module-library":{"id":"the-new-architecture/create-module-library","title":"创建模块库","description":"React Native 有一个丰富的生态系统库来解决常见问题。我们在 reactnative.directory 网站上收集 React Native 库,这是一个很好的资源,值得每个 React Native 开发者收藏。","sidebar":"docs"},"the-new-architecture/custom-cxx-types":{"id":"the-new-architecture/custom-cxx-types","title":"高级:自定义 C++ 类型","description":"本指南假设你熟悉 纯 C++ Turbo Native 模块 指南。它将在此基础上进行构建。","sidebar":"docs"},"the-new-architecture/cxx-custom-types":{"id":"the-new-architecture/cxx-custom-types","title":"支持自定义 C++ 类型","description":"默认情况下,C++ Turbo Native 模块支持大多数 std:: 标准类型的桥接功能。"},"the-new-architecture/cxx-cxxturbomodules":{"id":"the-new-architecture/cxx-cxxturbomodules","title":"C++ Turbo 原生模块","description":"本指南将向您展示如何仅使用 C++ 实现 Turbo 原生模块,以便与任何支持的平台(Android、iOS、macOS 或 Windows)共享相同的实现。"},"the-new-architecture/landing-page":{"id":"the-new-architecture/landing-page","title":"新架构介绍","description":"从 0.68 版本开始,React Native 提供了新架构,它为开发者提供了构建高性能和响应式应用的新功能。请访问\\"为何要设计新架构\\"来了解更多关于促使我们决定重新架构的原因,以及它提供的好处。"},"the-new-architecture/pillars":{"id":"the-new-architecture/pillars","title":"新架构的两大支柱","description":"新架构主要由两大支柱组成:"},"the-new-architecture/pillars-codegen":{"id":"the-new-architecture/pillars-codegen","title":"Codegen","description":"Codegen 不算是新架构的主要组成部分,它是一个帮助我们避免编写重复代码的工具。Codegen 并非必选项,您仍然可以手写它所生成的代码,但是使用它来生成脚手架代码可以帮您节省不少时间。"},"the-new-architecture/pillars-fabric-components":{"id":"the-new-architecture/pillars-fabric-components","title":"Fabric 组件","description":"Fabric 组件是一种使用 Fabric 渲染器渲染并展示在屏幕上的 UI 组件。在新架构中,使用 Fabric 组件替代原生组件具有以下优势:"},"the-new-architecture/pillars-turbomodules":{"id":"the-new-architecture/pillars-turbomodules","title":"TurboModules","description":"如果您使用过 React Native,您可能了解过 Native Modules 这个概念。它可以通过 React Native 的「Bridge」帮助 JavaScript 和原生代码进行交互,并使用跨平台的数据格式 JSON 进行通讯。"},"the-new-architecture/pure-cxx-modules":{"id":"the-new-architecture/pure-cxx-modules","title":"纯 C++ Turbo 原生模块","description":"编写 C++ 模块是跨 Android 和 iOS 共享平台无关代码的最佳方式。使用纯 C++ 模块,您只需编写一次逻辑,即可在所有平台上重用它,而无需编写平台特定的代码。","sidebar":"docs"},"the-new-architecture/use-app-template":{"id":"the-new-architecture/use-app-template","title":"创建启用新架构的应用","description":"本文档将帮助你从头创建一个启用了新架构的 React Native 应用。"},"the-new-architecture/using-codegen":{"id":"the-new-architecture/using-codegen","title":"使用 Codegen","description":"本指南将教你如何:","sidebar":"docs"},"the-new-architecture/what-is-codegen":{"id":"the-new-architecture/what-is-codegen","title":"什么是 Codegen?","description":"Codegen 是一个避免编写大量重复代码的工具。使用 Codegen 并不是必须的:您可以手动编写所有生成的代码。然而,Codegen 生成的脚手架代码可以节省您很多时间。","sidebar":"docs"},"the-new-architecture/why":{"id":"the-new-architecture/why","title":"为何要设计新架构","description":"新架构的目标是解决困扰旧架构在性能和灵活性方面的一些问题。本节提供了基本的背景,以了解旧架构的局限性,以及如何通过新架构来克服这些局限性。"},"threading-model":{"id":"threading-model","title":"线程模型","description":"文档介绍了即将发布的新渲染器 Fabric 的架构。"},"timepickerandroid":{"id":"timepickerandroid","title":"🚧 TimePickerAndroid","description":"已过时。 Use @react-native-community/datetimepicker instead."},"timers":{"id":"timers","title":"定时器","description":"定时器是一个应用中非常重要的部分。React Native 实现了和浏览器一致的定时器 Timer。","sidebar":"docs"},"toastandroid":{"id":"toastandroid","title":"ToastAndroid","description":"本模块将原生的 ToastAndroid 模块导出为一个 JS 模块,用于在 Android 设备上显示一个悬浮的提示信息。本模块包含一个show方法接受以下的参数:","sidebar":"api"},"touchablehighlight":{"id":"touchablehighlight","title":"TouchableHighlight","description":"我们建议使用Pressable组件,它更具扩展性且会是官方未来力推的主流。","sidebar":"组件"},"touchablenativefeedback":{"id":"touchablenativefeedback","title":"TouchableNativeFeedback","description":"If you\'re looking for a more extensive and future-proof way to handle touch-based input, check out the Pressable API.","sidebar":"组件"},"touchableopacity":{"id":"touchableopacity","title":"TouchableOpacity","description":"If you\'re looking for a more extensive and future-proof way to handle touch-based input, check out the Pressable API.","sidebar":"组件"},"touchablewithoutfeedback":{"id":"touchablewithoutfeedback","title":"TouchableWithoutFeedback","description":"If you\'re looking for a more extensive and future-proof way to handle touch-based input, check out the Pressable API.","sidebar":"组件"},"transforms":{"id":"transforms","title":"变换(Transform)","description":"变换(Transform)是样式属性,可帮助您使用 2D 或 3D 变换修改组件的外观和位置。然而,即便使用了变换,使用变换的组件的布局并不会变化,因此可能会与附近的组件重叠。您可以对变换的组件、附近的组件应用边距,或对容器应用填充,以防止这种重叠。","sidebar":"api"},"troubleshooting":{"id":"troubleshooting","title":"Troubleshooting","description":"These are some common issues you may run into while setting up React Native. If you encounter something that is not listed here, try searching for the issue in GitHub."},"turbo-native-modules-android":{"id":"turbo-native-modules-android","title":"Turbo 原生模块:Android","description":"现在我们来编写一些 Android 平台代码,以确保 localStorage 在应用关闭后仍然可以持久保存数据。"},"turbo-native-modules-introduction":{"id":"turbo-native-modules-introduction","title":"Turbo 原生模块介绍","description":"你的 React Native 应用代码可能需要与 React Native 或现有库未提供的原生平台 API 进行交互。你可以使用 Turbo 原生模块 自己编写集成代码。本指南将向你展示如何编写一个。","sidebar":"docs"},"turbo-native-modules-ios":{"id":"turbo-native-modules-ios","title":"Turbo 原生模块:iOS","description":"现在我们来编写一些 iOS 平台代码,以确保 localStorage 在应用关闭后仍然可以持久保存数据。"},"tutorial":{"id":"tutorial","title":"示例教程:Hello World","description":"React Native 看起来很像 React,只不过其基础组件是原生组件而非 web 组件。要理解 React Native 应用的基本结构,首先需要了解一些基本的 React 的概念,比如 JSX 语法、组件、state状态以及props属性。如果你已经了解了 React,那么还需要掌握一些 React Native 特有的知识,比如原生组件的使用。这篇教程可以供任何基础的读者学习,不管你是否有 React 方面的经验。"},"typescript":{"id":"typescript","title":"使用 TypeScript","description":"TypeScript 是一种通过添加类型定义来扩展 JavaScript 的语言。新的 React Native 项目默认以 TypeScript 为目标,同时也支持 JavaScript 和 Flow。","sidebar":"docs"},"upgrading":{"id":"upgrading","title":"更新","description":"时刻将 React Native 更新到最新的版本,可以获得更多 API、视图、开发者工具以及其他一些好东西(译注:官方开发任务繁重,人手紧缺,几乎不会对旧版本提供维护支持,所以即便更新可能带来一些兼容上的变更,但建议开发者还是尽一切可能第一时间更新)。由于一个完整的 React Native 项目是由 Android 项目、iOS 项目和 JavaScript 项目组成的,且都打包在一个 npm 包中,所以升级可能会有一些麻烦。我们会尽量简化这一流程。你可以在项目目录下使用npx react-native info命令查看当前的版本。","sidebar":"docs"},"usecolorscheme":{"id":"usecolorscheme","title":"useColorScheme","description":"useColorScheme 这个React hook 提供并订阅来自Appearance模块的颜色方案更新。返回值表示当前用户首选的颜色方案。该值可以稍后通过直接用户动作(例如,设备设置中的主题选择)或根据时间表(例如,遵循白天/夜晚周期的亮主题和暗主题)来更新。","sidebar":"api"},"usewindowdimensions":{"id":"usewindowdimensions","title":"useWindowDimensions","description":"useWindowDimensions会在屏幕尺寸变化时自动更新获取到的设备width和height值。使用方法如下:","sidebar":"api"},"using-a-listview":{"id":"using-a-listview","title":"使用长列表","description":"React Native 提供了几个适用于展示长列表数据的组件,一般而言我们会选用FlatList或是SectionList。","sidebar":"docs"},"using-a-scrollview":{"id":"using-a-scrollview","title":"使用滚动视图","description":"ScrollView是一个通用的可滚动的容器,你可以在其中放入多个组件和视图,而且这些组件并不需要是同类型的。ScrollView 不仅可以垂直滚动,还能水平滚动(通过horizontal属性来设置)。","sidebar":"docs"},"vibration":{"id":"vibration","title":"Vibration","description":"使设备振动。","sidebar":"api"},"view":{"id":"view","title":"View","description":"作为创建 UI 时最基础的组件,View 是一个支持 Flexbox 布局、样式、触摸响应、和一些无障碍功能的容器。不论在什么平台上,View 都直接对应当前平台的原生视图,无论它是 UIView、div 还是 android.view.View。","sidebar":"组件"},"view-flattening":{"id":"view-flattening","title":"视图拍平","description":"This document refers to the architecture of the new renderer, Fabric, that is in active roll-out."},"view-style-props":{"id":"view-style-props","title":"View 样式属性","description":"示例","sidebar":"组件"},"viewpagerandroid":{"id":"viewpagerandroid","title":"🚧 ViewPagerAndroid","description":"已过时。 Use @react-native-community/viewpager instead."},"viewtoken":{"id":"viewtoken","title":"ViewToken 对象","description":"ViewToken object is returned as one of properties in the onViewableItemsChanged callback, for example in FlatList component. It is exported by ViewabilityHelper.js.","sidebar":"组件"},"virtualizedlist":{"id":"virtualizedlist","title":"VirtualizedList","description":"FlatList和SectionList的底层实现。FlatList 和 SectionList 使用起来更方便,同时也有相对更详细的文档。一般来说,仅当想获得比 FlatList 更高的灵活性(比如说在使用 immutable data 而不是 普通数组)的时候,你才应该考虑使用 VirtualizedList。","sidebar":"组件"},"xplat-implementation":{"id":"xplat-implementation","title":"跨平台的实现","description":"This document refers to the architecture of the new renderer, Fabric, that is in active roll-out."}}}}'); + +/***/ }) + +}; +; \ No newline at end of file diff --git a/assets/js/0058b4c6.476207c4.js b/assets/js/0058b4c6.476207c4.js new file mode 100644 index 00000000000..5b0d7afe8a8 --- /dev/null +++ b/assets/js/0058b4c6.476207c4.js @@ -0,0 +1 @@ +"use strict";(self.webpackChunkreact_native_website=self.webpackChunkreact_native_website||[]).push([[90849],{86164:e=>{e.exports=JSON.parse('{"version":{"pluginId":"default","version":"0.76","label":"0.76","banner":null,"badge":false,"noIndex":false,"className":"docs-version-0.76","isLast":true,"docsSidebars":{"docs":[{"type":"category","label":"\u5165\u95e8\u57fa\u7840","items":[{"type":"link","label":"\u7b80\u4ecb","href":"/docs/getting-started","docId":"getting-started","unlisted":false},{"type":"link","label":"\u6838\u5fc3\u7ec4\u4ef6\u4e0e\u539f\u751f\u7ec4\u4ef6","href":"/docs/intro-react-native-components","docId":"intro-react-native-components","unlisted":false},{"type":"link","label":"React \u57fa\u7840","href":"/docs/intro-react","docId":"intro-react","unlisted":false},{"type":"link","label":"\u5904\u7406\u6587\u672c\u8f93\u5165","href":"/docs/handling-text-input","docId":"handling-text-input","unlisted":false},{"type":"link","label":"\u4f7f\u7528\u6eda\u52a8\u89c6\u56fe","href":"/docs/using-a-scrollview","docId":"using-a-scrollview","unlisted":false},{"type":"link","label":"\u4f7f\u7528\u957f\u5217\u8868","href":"/docs/using-a-listview","docId":"using-a-listview","unlisted":false},{"type":"link","label":"\u7279\u5b9a\u5e73\u53f0\u4ee3\u7801","href":"/docs/platform-specific-code","docId":"platform-specific-code","unlisted":false},{"type":"link","label":"\u5176\u4ed6\u53c2\u8003\u8d44\u6e90","href":"/docs/more-resources","docId":"more-resources","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"\u73af\u5883\u642d\u5efa","items":[{"type":"link","label":"\u642d\u5efa\u5f00\u53d1\u73af\u5883","href":"/docs/environment-setup","docId":"environment-setup","unlisted":false},{"type":"link","label":"\u96c6\u6210\u5230\u73b0\u6709\u539f\u751f\u5e94\u7528","href":"/docs/integration-with-existing-apps","docId":"integration-with-existing-apps","unlisted":false},{"type":"link","label":"\u96c6\u6210\u5230 Android Fragment","href":"/docs/integration-with-android-fragment","docId":"integration-with-android-fragment","unlisted":false},{"type":"link","label":"\u4e3a\u7535\u89c6\u548c\u673a\u9876\u76d2\u5236\u4f5c\u5e94\u7528","href":"/docs/building-for-tv","docId":"building-for-tv","unlisted":false},{"type":"link","label":"\u591a\u5e73\u53f0\u652f\u6301","href":"/docs/out-of-tree-platforms","docId":"out-of-tree-platforms","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"\u5f00\u53d1\u6d41\u7a0b","items":[{"type":"link","label":"\u5728\u8bbe\u5907\u4e0a\u8fd0\u884c","href":"/docs/running-on-device","docId":"running-on-device","unlisted":false},{"type":"link","label":"\u5feb\u901f\u5237\u65b0","href":"/docs/fast-refresh","docId":"fast-refresh","unlisted":false},{"type":"link","label":"Metro","href":"/docs/metro","docId":"metro","unlisted":false},{"type":"link","label":"\u4f7f\u7528\u7b2c\u4e09\u65b9\u5e93","href":"/docs/libraries","docId":"libraries","unlisted":false},{"type":"link","label":"\u4f7f\u7528 TypeScript","href":"/docs/typescript","docId":"typescript","unlisted":false},{"type":"link","label":"\u66f4\u65b0","href":"/docs/upgrading","docId":"upgrading","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"\u754c\u9762\u4e0e\u4ea4\u4e92","items":[{"type":"link","label":"\u6837\u5f0f","href":"/docs/style","docId":"style","unlisted":false},{"type":"link","label":"\u9ad8\u5ea6\u4e0e\u5bbd\u5ea6","href":"/docs/height-and-width","docId":"height-and-width","unlisted":false},{"type":"link","label":"\u4f7f\u7528 Flexbox \u5e03\u5c40","href":"/docs/flexbox","docId":"flexbox","unlisted":false},{"type":"link","label":"\u56fe\u7247","href":"/docs/images","docId":"images","unlisted":false},{"type":"link","label":"\u989c\u8272","href":"/docs/colors","docId":"colors","unlisted":false},{"type":"category","label":"\u4ea4\u4e92","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"\u5904\u7406\u89e6\u6478\u4e8b\u4ef6","href":"/docs/handling-touches","docId":"handling-touches","unlisted":false},{"type":"link","label":"\u4f7f\u7528\u5bfc\u822a\u5668\u8df3\u8f6c\u9875\u9762","href":"/docs/navigation","docId":"navigation","unlisted":false},{"type":"link","label":"\u52a8\u753b","href":"/docs/animations","docId":"animations","unlisted":false},{"type":"link","label":"\u624b\u52bf\u54cd\u5e94\u7cfb\u7edf","href":"/docs/gesture-responder-system","docId":"gesture-responder-system","unlisted":false}]},{"type":"category","label":"\u7f51\u7edc\u8fde\u63a5","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"\u8bbf\u95ee\u7f51\u7edc","href":"/docs/network","docId":"network","unlisted":false},{"type":"link","label":"\u7f51\u7edc\u5b89\u5168\u7b56\u7565","href":"/docs/security","docId":"security","unlisted":false}]},{"type":"category","label":"\u5305\u5bb9\u6027","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"\u65e0\u969c\u788d\u529f\u80fd","href":"/docs/accessibility","docId":"accessibility","unlisted":false}]}],"collapsed":true,"collapsible":true},{"type":"category","label":"\u8c03\u8bd5","items":[{"type":"link","label":"\u8c03\u8bd5","href":"/docs/debugging","docId":"debugging","unlisted":false},{"type":"link","label":"React Native \u5f00\u53d1\u8005\u5de5\u5177","href":"/docs/react-native-devtools","docId":"react-native-devtools","unlisted":false},{"type":"link","label":"\u8c03\u8bd5\u539f\u751f\u4ee3\u7801","href":"/docs/debugging-native-code","docId":"debugging-native-code","unlisted":false},{"type":"link","label":"\u8c03\u8bd5\u53d1\u884c\u7248\u672c","href":"/docs/debugging-release-builds","docId":"debugging-release-builds","unlisted":false},{"type":"link","label":"\u5176\u4ed6\u8c03\u8bd5\u65b9\u6cd5","href":"/docs/other-debugging-methods","docId":"other-debugging-methods","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"\u6d4b\u8bd5","items":[{"type":"link","label":"Testing","href":"/docs/testing-overview","docId":"testing-overview","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"\u6027\u80fd\u8c03\u4f18","items":[{"type":"link","label":"\u6027\u80fd\u7efc\u8ff0","href":"/docs/performance","docId":"performance","unlisted":false},{"type":"link","label":"\u4f18\u5316\u7f16\u8bd1\u901f\u5ea6","href":"/docs/build-speed","docId":"build-speed","unlisted":false},{"type":"link","label":"\u5217\u8868\u914d\u7f6e\u4f18\u5316","href":"/docs/optimizing-flatlist-configuration","docId":"optimizing-flatlist-configuration","unlisted":false},{"type":"link","label":"Optimizing JavaScript loading","href":"/docs/optimizing-javascript-loading","docId":"optimizing-javascript-loading","unlisted":false},{"type":"link","label":"Profiling","href":"/docs/profiling","docId":"profiling","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"JavaScript \u8fd0\u884c\u73af\u5883","items":[{"type":"link","label":"JavaScript \u73af\u5883","href":"/docs/javascript-environment","docId":"javascript-environment","unlisted":false},{"type":"link","label":"\u5b9a\u65f6\u5668","href":"/docs/timers","docId":"timers","unlisted":false},{"type":"link","label":"\u4f7f\u7528\u65b0\u7684 Hermes \u5f15\u64ce","href":"/docs/hermes","docId":"hermes","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"Codegen","items":[{"type":"link","label":"\u4ec0\u4e48\u662f Codegen\uff1f","href":"/docs/the-new-architecture/what-is-codegen","docId":"the-new-architecture/what-is-codegen","unlisted":false},{"type":"link","label":"\u4f7f\u7528 Codegen","href":"/docs/the-new-architecture/using-codegen","docId":"the-new-architecture/using-codegen","unlisted":false},{"type":"link","label":"Codegen \u547d\u4ee4\u884c\u5de5\u5177","href":"/docs/the-new-architecture/codegen-cli","docId":"the-new-architecture/codegen-cli","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"\u539f\u751f\u5f00\u53d1","items":[{"type":"link","label":"\u6865\u63a5\u539f\u751f\u5e73\u53f0\u80fd\u529b","href":"/docs/native-platform","docId":"native-platform","unlisted":false},{"type":"category","label":"\u539f\u751f\u6a21\u5757","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"Turbo \u539f\u751f\u6a21\u5757\u4ecb\u7ecd","href":"/docs/turbo-native-modules-introduction","docId":"turbo-native-modules-introduction","unlisted":false},{"type":"link","label":"\u7eaf C++ Turbo \u539f\u751f\u6a21\u5757","href":"/docs/the-new-architecture/pure-cxx-modules","docId":"the-new-architecture/pure-cxx-modules","unlisted":false},{"type":"link","label":"\u9ad8\u7ea7\uff1a\u81ea\u5b9a\u4e49 C++ \u7c7b\u578b","href":"/docs/the-new-architecture/custom-cxx-types","docId":"the-new-architecture/custom-cxx-types","unlisted":false}]},{"type":"category","label":"\u539f\u751f UI \u7ec4\u4ef6","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"Fabric Native Components Introduction","href":"/docs/fabric-native-components-introduction","docId":"fabric-native-components-introduction","unlisted":false}]},{"type":"category","label":"\u5176\u4ed6","collapsible":true,"collapsed":true,"items":[{"type":"link","label":"\u9644\u5f55","href":"/docs/appendix","docId":"appendix","unlisted":false},{"type":"link","label":"\u521b\u5efa\u6a21\u5757\u5e93","href":"/docs/the-new-architecture/create-module-library","docId":"the-new-architecture/create-module-library","unlisted":false}]}],"collapsed":true,"collapsible":true},{"type":"category","label":"Android \u4e0e iOS \u6307\u5357","items":[{"type":"category","label":"Android","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"Headless JS\uff08\u540e\u53f0\u4efb\u52a1\uff09","href":"/docs/headless-js-android","docId":"headless-js-android","unlisted":false},{"type":"link","label":"\u6253\u5305\u53d1\u5e03","href":"/docs/signed-apk-android","docId":"signed-apk-android","unlisted":false},{"type":"link","label":"\u548c\u539f\u751f\u7aef\u901a\u4fe1","href":"/docs/communication-android","docId":"communication-android","unlisted":false},{"type":"link","label":"React Native Gradle Plugin","href":"/docs/react-native-gradle-plugin","docId":"react-native-gradle-plugin","unlisted":false}]},{"type":"category","label":"iOS","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"\u94fe\u63a5\u539f\u751f\u5e93","href":"/docs/linking-libraries-ios","docId":"linking-libraries-ios","unlisted":false},{"type":"link","label":"\u5728iOS\u6a21\u62df\u5668\u4e0a\u8fd0\u884c","href":"/docs/running-on-simulator-ios","docId":"running-on-simulator-ios","unlisted":false},{"type":"link","label":"\u548c\u539f\u751f\u7aef\u901a\u4fe1","href":"/docs/communication-ios","docId":"communication-ios","unlisted":false},{"type":"link","label":"iOS \u5e94\u7528\u5c0f\u7ec4\u4ef6","href":"/docs/app-extensions","docId":"app-extensions","unlisted":false},{"type":"link","label":"\u4e0a\u67b6 App Store","href":"/docs/publishing-to-app-store","docId":"publishing-to-app-store","unlisted":false}]}],"collapsed":true,"collapsible":true},{"type":"category","label":"\u65e7\u67b6\u6784","items":[{"type":"category","label":"\u539f\u751f\u6a21\u5757\uff08\u65e7\u67b6\u6784\uff09","collapsible":true,"collapsed":true,"items":[{"type":"link","label":"\u539f\u751f\u6a21\u5757\u7b80\u4ecb","href":"/docs/legacy/native-modules-intro","docId":"legacy/native-modules-intro","unlisted":false},{"type":"link","label":"Android \u539f\u751f\u6a21\u5757","href":"/docs/legacy/native-modules-android","docId":"legacy/native-modules-android","unlisted":false},{"type":"link","label":"iOS \u539f\u751f\u6a21\u5757","href":"/docs/legacy/native-modules-ios","docId":"legacy/native-modules-ios","unlisted":false},{"type":"link","label":"Native Modules NPM Package Setup","href":"/docs/legacy/native-modules-setup","docId":"legacy/native-modules-setup","unlisted":false},{"type":"link","label":"Local libraries setup","href":"/docs/legacy/local-library-setup","docId":"legacy/local-library-setup","unlisted":false}]},{"type":"category","label":"\u539f\u751f UI \u7ec4\u4ef6\uff08\u65e7\u67b6\u6784\uff09","collapsible":true,"collapsed":true,"items":[{"type":"link","label":"Android \u539f\u751fUI\u7ec4\u4ef6","href":"/docs/legacy/native-components-android","docId":"legacy/native-components-android","unlisted":false},{"type":"link","label":"iOS \u539f\u751fUI\u7ec4\u4ef6","href":"/docs/legacy/native-components-ios","docId":"legacy/native-components-ios","unlisted":false},{"type":"link","label":"\u76f4\u63a5\u64cd\u4f5c","href":"/docs/legacy/direct-manipulation","docId":"legacy/direct-manipulation","unlisted":false}]}],"collapsed":true,"collapsible":true}],"api":[{"type":"category","label":"APIs","items":[{"type":"link","label":"AccessibilityInfo","href":"/docs/accessibilityinfo","docId":"accessibilityinfo","unlisted":false},{"type":"link","label":"Alert","href":"/docs/alert","docId":"alert","unlisted":false},{"type":"link","label":"Animated","href":"/docs/animated","docId":"animated","unlisted":false},{"type":"link","label":"Animated.Value","href":"/docs/animatedvalue","docId":"animatedvalue","unlisted":false},{"type":"link","label":"Animated.ValueXY","href":"/docs/animatedvaluexy","docId":"animatedvaluexy","unlisted":false},{"type":"link","label":"Appearance","href":"/docs/appearance","docId":"appearance","unlisted":false},{"type":"link","label":"AppRegistry","href":"/docs/appregistry","docId":"appregistry","unlisted":false},{"type":"link","label":"AppState","href":"/docs/appstate","docId":"appstate","unlisted":false},{"type":"link","label":"DevSettings","href":"/docs/devsettings","docId":"devsettings","unlisted":false},{"type":"link","label":"Dimensions","href":"/docs/dimensions","docId":"dimensions","unlisted":false},{"type":"link","label":"Easing","href":"/docs/easing","docId":"easing","unlisted":false},{"type":"link","label":"InteractionManager","href":"/docs/interactionmanager","docId":"interactionmanager","unlisted":false},{"type":"link","label":"Keyboard","href":"/docs/keyboard","docId":"keyboard","unlisted":false},{"type":"link","label":"LayoutAnimation","href":"/docs/layoutanimation","docId":"layoutanimation","unlisted":false},{"type":"link","label":"Linking","href":"/docs/linking","docId":"linking","unlisted":false},{"type":"link","label":"PanResponder","href":"/docs/panresponder","docId":"panresponder","unlisted":false},{"type":"link","label":"PixelRatio","href":"/docs/pixelratio","docId":"pixelratio","unlisted":false},{"type":"link","label":"Platform","href":"/docs/platform","docId":"platform","unlisted":false},{"type":"link","label":"PlatformColor","href":"/docs/platformcolor","docId":"platformcolor","unlisted":false},{"type":"link","label":"RootTag","href":"/docs/roottag","docId":"roottag","unlisted":false},{"type":"link","label":"Share","href":"/docs/share","docId":"share","unlisted":false},{"type":"link","label":"StyleSheet","href":"/docs/stylesheet","docId":"stylesheet","unlisted":false},{"type":"link","label":"Systrace","href":"/docs/systrace","docId":"systrace","unlisted":false},{"type":"link","label":"\u53d8\u6362\uff08Transform\uff09","href":"/docs/transforms","docId":"transforms","unlisted":false},{"type":"link","label":"Vibration","href":"/docs/vibration","docId":"vibration","unlisted":false},{"type":"category","label":"Hooks","collapsed":false,"items":[{"type":"link","label":"useColorScheme","href":"/docs/usecolorscheme","docId":"usecolorscheme","unlisted":false},{"type":"link","label":"useWindowDimensions","href":"/docs/usewindowdimensions","docId":"usewindowdimensions","unlisted":false}],"collapsible":true},{"type":"category","label":"Android API","collapsed":false,"items":[{"type":"link","label":"BackHandler","href":"/docs/backhandler","docId":"backhandler","unlisted":false},{"type":"link","label":"PermissionsAndroid","href":"/docs/permissionsandroid","docId":"permissionsandroid","unlisted":false},{"type":"link","label":"ToastAndroid","href":"/docs/toastandroid","docId":"toastandroid","unlisted":false}],"collapsible":true},{"type":"category","label":"iOS API","collapsed":false,"items":[{"type":"link","label":"ActionSheetIOS","href":"/docs/actionsheetios","docId":"actionsheetios","unlisted":false},{"type":"link","label":"DynamicColorIOS","href":"/docs/dynamiccolorios","docId":"dynamiccolorios","unlisted":false},{"type":"link","label":"Settings","href":"/docs/settings","docId":"settings","unlisted":false}],"collapsible":true}],"collapsed":true,"collapsible":true}],"\u7ec4\u4ef6":[{"type":"category","label":"\u6838\u5fc3\u7ec4\u4ef6","items":[{"type":"link","label":"\u6838\u5fc3\u7ec4\u4ef6\u548cAPI","href":"/docs/components-and-apis","docId":"components-and-apis","unlisted":false},{"type":"link","label":"ActivityIndicator","href":"/docs/activityindicator","docId":"activityindicator","unlisted":false},{"type":"link","label":"Button","href":"/docs/button","docId":"button","unlisted":false},{"type":"link","label":"FlatList","href":"/docs/flatlist","docId":"flatlist","unlisted":false},{"type":"link","label":"Image","href":"/docs/image","docId":"image","unlisted":false},{"type":"link","label":"ImageBackground","href":"/docs/imagebackground","docId":"imagebackground","unlisted":false},{"type":"link","label":"KeyboardAvoidingView","href":"/docs/keyboardavoidingview","docId":"keyboardavoidingview","unlisted":false},{"type":"link","label":"Modal","href":"/docs/modal","docId":"modal","unlisted":false},{"type":"link","label":"Pressable","href":"/docs/pressable","docId":"pressable","unlisted":false},{"type":"link","label":"RefreshControl","href":"/docs/refreshcontrol","docId":"refreshcontrol","unlisted":false},{"type":"link","label":"ScrollView","href":"/docs/scrollview","docId":"scrollview","unlisted":false},{"type":"link","label":"SectionList","href":"/docs/sectionlist","docId":"sectionlist","unlisted":false},{"type":"link","label":"StatusBar","href":"/docs/statusbar","docId":"statusbar","unlisted":false},{"type":"link","label":"Switch","href":"/docs/switch","docId":"switch","unlisted":false},{"type":"link","label":"Text","href":"/docs/text","docId":"text","unlisted":false},{"type":"link","label":"TextInput","href":"/docs/textinput","docId":"textinput","unlisted":false},{"type":"link","label":"TouchableHighlight","href":"/docs/touchablehighlight","docId":"touchablehighlight","unlisted":false},{"type":"link","label":"TouchableOpacity","href":"/docs/touchableopacity","docId":"touchableopacity","unlisted":false},{"type":"link","label":"TouchableWithoutFeedback","href":"/docs/touchablewithoutfeedback","docId":"touchablewithoutfeedback","unlisted":false},{"type":"link","label":"View","href":"/docs/view","docId":"view","unlisted":false},{"type":"link","label":"VirtualizedList","href":"/docs/virtualizedlist","docId":"virtualizedlist","unlisted":false},{"type":"category","label":"Android \u7ec4\u4ef6","collapsed":false,"items":[{"type":"link","label":"DrawerLayoutAndroid","href":"/docs/drawerlayoutandroid","docId":"drawerlayoutandroid","unlisted":false},{"type":"link","label":"TouchableNativeFeedback","href":"/docs/touchablenativefeedback","docId":"touchablenativefeedback","unlisted":false}],"collapsible":true},{"type":"category","label":"iOS \u7ec4\u4ef6","collapsed":false,"items":[{"type":"link","label":"InputAccessoryView","href":"/docs/inputaccessoryview","docId":"inputaccessoryview","unlisted":false},{"type":"link","label":"SafeAreaView","href":"/docs/safeareaview","docId":"safeareaview","unlisted":false}],"collapsible":true}],"collapsed":true,"collapsible":true},{"type":"category","label":"Props","items":[{"type":"link","label":"\u56fe\u7247\u6837\u5f0f\u5c5e\u6027","href":"/docs/image-style-props","docId":"image-style-props","unlisted":false},{"type":"link","label":"\u5e03\u5c40\u5c5e\u6027","href":"/docs/layout-props","docId":"layout-props","unlisted":false},{"type":"link","label":"\u9634\u5f71\u6837\u5f0f\u5c5e\u6027","href":"/docs/shadow-props","docId":"shadow-props","unlisted":false},{"type":"link","label":"Text \u6837\u5f0f\u5c5e\u6027","href":"/docs/text-style-props","docId":"text-style-props","unlisted":false},{"type":"link","label":"View \u6837\u5f0f\u5c5e\u6027","href":"/docs/view-style-props","docId":"view-style-props","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"\u5185\u90e8\u5bf9\u8c61\u7c7b\u578b","items":[{"type":"link","label":"\u5e03\u5c40\u4e8b\u4ef6\u5bf9\u8c61","href":"/docs/layoutevent","docId":"layoutevent","unlisted":false},{"type":"link","label":"\u70b9\u51fb\u4e8b\u4ef6\u5bf9\u8c61","href":"/docs/pressevent","docId":"pressevent","unlisted":false},{"type":"link","label":"React \u8282\u70b9\u5bf9\u8c61","href":"/docs/react-node","docId":"react-node","unlisted":false},{"type":"link","label":"\u77e9\u5f62\u533a\u57df\u5bf9\u8c61","href":"/docs/rect","docId":"rect","unlisted":false},{"type":"link","label":"ViewToken \u5bf9\u8c61","href":"/docs/viewtoken","docId":"viewtoken","unlisted":false}],"collapsed":true,"collapsible":true}]},"docs":{"accessibility":{"id":"accessibility","title":"\u65e0\u969c\u788d\u529f\u80fd","description":"\u8bd1\u6ce8\uff1aaccessibility \u4e00\u8bcd\u5e38\u89c1\u591a\u79cd\u8bd1\u6cd5\uff1a\u53ef\u8bbf\u95ee\u6027\u3001\u65e0\u969c\u788d\u6027\u3001\u8f85\u52a9\u529f\u80fd\u7b49\u7b49\uff0c\u5176\u4e2d\u6587\u610f\u601d\u90fd\u4e0d\u592a\u80fd\u51c6\u786e\u8868\u8fbe\u5176\u529f\u80fd\u7684\u672c\u8d28\u2014\u2014\u5373\u4e3a\u6b8b\u969c\u4eba\u58eb\u63d0\u4f9b\u4fbf\u5229\u3002\u672c\u6587\u4e3b\u8981\u91c7\u7528\u201c\u65e0\u969c\u788d\u529f\u80fd\u201d\u548c\u201c\u8f85\u52a9\u6280\u672f/\u670d\u52a1\u201d\u7684\u8bf4\u6cd5\u3002\u5982\u679c\u4f60\u6216\u4f60\u7684\u516c\u53f8\u6682\u65f6\u6ca1\u6709\u8d44\u6e90\u548c\u7cbe\u529b\u53bb\u670d\u52a1\u8fd9\u4e9b\u7528\u6237\uff0c\u90a3\u4e48\u4f60\u53ef\u4ee5\u8df3\u8fc7\u672c\u6587\u3002\u4f46\u662f\uff0c\u8bd1\u8005\u4e2a\u4eba\u5e0c\u671b\u501f\u672c\u6587\u6863\uff0c\u547c\u5401\u6709\u80fd\u529b\u6709\u8d44\u6e90\u7684\u5546\u4e1a\u516c\u53f8/\u7ec4\u7ec7/\u4e2a\u4eba\uff0c\u91cd\u89c6\u6b8b\u969c\u4eba\u58eb\u4f7f\u7528\u667a\u80fd\u624b\u673a\u7684\u6743\u5229\u3002","sidebar":"docs"},"accessibilityinfo":{"id":"accessibilityinfo","title":"AccessibilityInfo","description":"\u6709\u65f6\u5019\u6211\u4eec\u5e0c\u671b\u77e5\u9053\u7528\u6237\u7684\u8bbe\u5907\u662f\u5426\u6b63\u5728\u8fd0\u884c\u8bfb\u5c4f\u5e94\u7528\u3002AccessibilityInfo\u6b63\u662f\u7528\u4e8e\u6b64\u76ee\u7684\u3002\u4f60\u53ef\u4ee5\u7528\u5b83\u6765\u67e5\u8be2\u8bfb\u5c4f\u5e94\u7528\u7684\u5f53\u524d\u72b6\u6001\uff0c\u5e76\u4e14\u53ef\u4ee5\u76d1\u542c\u5176\u72b6\u6001\u53d8\u5316\u3002","sidebar":"api"},"actionsheetios":{"id":"actionsheetios","title":"ActionSheetIOS","description":"\u663e\u793a\u4e00\u4e2a iOS \u539f\u751f\u7684Action Sheet\u7ec4\u4ef6\u3002","sidebar":"api"},"activityindicator":{"id":"activityindicator","title":"ActivityIndicator","description":"\u663e\u793a\u4e00\u4e2a\u5706\u5f62\u7684 loading \u63d0\u793a\u7b26\u53f7\u3002","sidebar":"\u7ec4\u4ef6"},"alert":{"id":"alert","title":"Alert","description":"\u542f\u52a8\u4e00\u4e2a\u63d0\u793a\u5bf9\u8bdd\u6846\uff0c\u5305\u542b\u5bf9\u5e94\u7684\u6807\u9898\u548c\u4fe1\u606f\u3002","sidebar":"api"},"alertios":{"id":"alertios","title":"AlertIOS","description":"AlertIOS\u7528\u4e8e\u5f39\u51fa\u4e00\u4e2a iOS \u63d0\u793a\u5bf9\u8bdd\u6846\uff0c\u53ef\u4ee5\u901a\u77e5\u7528\u6237\u4e00\u4e9b\u4fe1\u606f\u6216\u662f\u63d0\u793a\u7528\u6237\u8f93\u5165\u4e00\u4e9b\u6587\u5b57\u3002"},"animated":{"id":"animated","title":"Animated","description":"Animated\u5e93\u65e8\u5728\u4f7f\u52a8\u753b\u53d8\u5f97\u6d41\u7545\uff0c\u5f3a\u5927\u5e76\u6613\u4e8e\u6784\u5efa\u548c\u7ef4\u62a4\u3002Animated\u4fa7\u91cd\u4e8e\u8f93\u5165\u548c\u8f93\u51fa\u4e4b\u95f4\u7684\u58f0\u660e\u6027\u5173\u7cfb\uff0c\u4ee5\u53ca\u4e24\u8005\u4e4b\u95f4\u7684\u53ef\u914d\u7f6e\u53d8\u6362\uff0c\u6b64\u5916\u8fd8\u63d0\u4f9b\u4e86\u7b80\u5355\u7684 start/stop\u65b9\u6cd5\u6765\u63a7\u5236\u57fa\u4e8e\u65f6\u95f4\u7684\u52a8\u753b\u6267\u884c\u3002","sidebar":"api"},"animatedvalue":{"id":"animatedvalue","title":"Animated.Value","description":"\u9a71\u52a8\u52a8\u753b\u7684\u4e00\u7ef4\u6807\u91cf\u503c. \u4e00\u4e2aAnimated.Value\u53ef\u4ee5\u540c\u6b65\u5730\u9a71\u52a8\u591a\u4e2a\u5c5e\u6027\uff0c\u4f46\u6bcf\u6b21\u53ea\u80fd\u4ee5\u4e00\u79cd\u52a8\u753b\u673a\u5236\u53d8\u5316\u3002\u5982\u679c\u6539\u7528\u4e86\u5176\u4ed6\u52a8\u753b\u673a\u5236\uff08\u4f8b\u5982\u5f00\u59cb\u4e00\u4e2a\u65b0\u7684\u52a8\u753b\u6216\u662f\u8c03\u7528setValue\uff09\uff0c\u5219\u4f1a\u505c\u6b62\u5148\u524d\u7684\u52a8\u753b\u3002","sidebar":"api"},"animatedvaluexy":{"id":"animatedvaluexy","title":"Animated.ValueXY","description":"2D \u503c\u7528\u4e8e\u9a71\u52a8 2D \u52a8\u753b\uff0c\u4f8b\u5982\u5e73\u79fb\u624b\u52bf\u3002\u4e0e\u666e\u901a\u7684Animated.Value\u51e0\u4e4e\u76f8\u540c\u7684 API\uff0c\u4f46\u662f\u53ef\u4ee5\u591a\u8def\u590d\u7528\u3002\u5728\u5185\u90e8\u5305\u542b\u4e24\u4e2a\u5e38\u89c4\u7684Animated.Value\u3002","sidebar":"api"},"animations":{"id":"animations","title":"\u52a8\u753b","description":"\u6d41\u7545\u3001\u6709\u610f\u4e49\u7684\u52a8\u753b\u5bf9\u4e8e\u79fb\u52a8\u5e94\u7528\u7528\u6237\u4f53\u9a8c\u6765\u8bf4\u662f\u975e\u5e38\u91cd\u8981\u7684\u3002\u73b0\u5b9e\u751f\u6d3b\u4e2d\u7684\u7269\u4f53\u5728\u5f00\u59cb\u79fb\u52a8\u548c\u505c\u4e0b\u6765\u7684\u65f6\u5019\u90fd\u5177\u6709\u4e00\u5b9a\u7684\u60ef\u6027\uff0c\u6211\u4eec\u5728\u754c\u9762\u4e2d\u4e5f\u53ef\u4ee5\u4f7f\u7528\u52a8\u753b\u6765\u5b9e\u73b0\u5951\u5408\u7269\u7406\u89c4\u5f8b\u7684\u4ea4\u4e92\u3002","sidebar":"docs"},"app-extensions":{"id":"app-extensions","title":"iOS \u5e94\u7528\u5c0f\u7ec4\u4ef6","description":"\u5c0f\u7ec4\u4ef6\u5141\u8bb8\u60a8\u5728\u4e3b\u8981\u5e94\u7528\u7a0b\u5e8f\u4e4b\u5916\u63d0\u4f9b\u81ea\u5b9a\u4e49\u529f\u80fd\u548c\u5185\u5bb9\u3002iOS\u4e0a\u6709\u4e0d\u540c\u7c7b\u578b\u7684\u5e94\u7528\u5c0f\u7ec4\u4ef6\uff0c\u5b83\u4eec\u90fd\u5728App Extension\u7f16\u7a0b\u6307\u5357\u4e2d\u8fdb\u884c\u4e86\u4ecb\u7ecd\u3002\u5728\u672c\u6307\u5357\u4e2d\uff0c\u6211\u4eec\u5c06\u7b80\u8981\u4ecb\u7ecd\u5982\u4f55\u5728iOS\u4e0a\u5229\u7528\u5e94\u7528\u5c0f\u7ec4\u4ef6\u7684\u4f18\u52bf\u3002","sidebar":"docs"},"appearance":{"id":"appearance","title":"Appearance","description":"Appearance \u6a21\u5757\u63d0\u4f9b\u4e86\u5173\u4e8e\u7528\u6237\u5916\u89c2\u504f\u597d\u7684\u4fe1\u606f\uff0c\u4f8b\u5982\u4ed6\u4eec\u559c\u6b22\u7684\u989c\u8272\u65b9\u6848\uff08\u660e\u4eae\u6216\u6697\u9ed1\uff09\u3002","sidebar":"api"},"appendix":{"id":"appendix","title":"\u9644\u5f55","description":"\u4e00\u3001\u672f\u8bed","sidebar":"docs"},"appregistry":{"id":"appregistry","title":"AppRegistry","description":"\u4ec5\u9002\u7528\u4e8e\u975e\u6c99\u76d2\u9879\u76ee","sidebar":"api"},"appstate":{"id":"appstate","title":"AppState","description":"AppState\u80fd\u544a\u8bc9\u4f60\u5e94\u7528\u5f53\u524d\u662f\u5728\u524d\u53f0\u8fd8\u662f\u5728\u540e\u53f0\uff0c\u5e76\u4e14\u80fd\u5728\u72b6\u6001\u53d8\u5316\u7684\u65f6\u5019\u901a\u77e5\u4f60\u3002","sidebar":"api"},"architecture-glossary":{"id":"architecture-glossary","title":"\u672f\u8bed\u8868","description":"Fabric \u6e32\u67d3\u5668\uff08Fabric Renderer\uff09"},"architecture-overview":{"id":"architecture-overview","title":"\u67b6\u6784\u6982\u89c8","description":"\u672c\u6587\u6863\u8fd8\u5728\u6301\u7eed\u66f4\u65b0\u4e2d\uff0c\u4f1a\u4ece\u6982\u5ff5\u4e0a\u4ecb\u7ecd React Native \u65b0\u67b6\u6784\u662f\u5982\u4f55\u5de5\u4f5c\u7684\u3002\u76ee\u6807\u8bfb\u8005\u5305\u62ec\u751f\u6001\u5e93\u7684\u5f00\u53d1\u8005\u3001\u6838\u5fc3\u8d21\u732e\u8005\u548c\u7279\u522b\u6709\u597d\u5947\u5fc3\u7684\u4eba\u3002"},"asyncstorage":{"id":"asyncstorage","title":"\ud83d\udea7 AsyncStorage","description":"\u5df2\u8fc7\u65f6\u3002 Use one of the community packages instead."},"backhandler":{"id":"backhandler","title":"BackHandler","description":"BackHandler API \u7528\u4e8e\u76d1\u542c\u8bbe\u5907\u4e0a\u7684\u540e\u9000\u6309\u94ae\u4e8b\u4ef6\uff0c\u53ef\u4ee5\u8c03\u7528\u4f60\u81ea\u5df1\u7684\u51fd\u6570\u6765\u5904\u7406\u540e\u9000\u884c\u4e3a\u3002\u6b64 API \u4ec5\u80fd\u5728 Android \u4e0a\u4f7f\u7528\u3002","sidebar":"api"},"build-speed":{"id":"build-speed","title":"\u4f18\u5316\u7f16\u8bd1\u901f\u5ea6","description":"\u6784\u5efa React Native \u5e94\u7528\u53ef\u80fd\u4f1a\u975e\u5e38\u6602\u8d35\uff0c\u5e76\u4e14\u9700\u8981\u5f00\u53d1\u4eba\u5458\u82b1\u8d39\u6570\u5206\u949f\u7684\u65f6\u95f4\u3002","sidebar":"docs"},"building-for-tv":{"id":"building-for-tv","title":"\u4e3a\u7535\u89c6\u548c\u673a\u9876\u76d2\u5236\u4f5c\u5e94\u7528","description":"\u76ee\u524d\u7684 React Native \u5e94\u7528\u53ea\u9700\u5728 JavaScript \u7aef\u7b80\u5355\u4fee\u6539\u751a\u81f3\u65e0\u9700\u4fee\u6539\uff0c\u5728\u7535\u89c6\u548c\u673a\u9876\u76d2\u8bbe\u5907\u4e0a\u5c31\u57fa\u672c\u53ef\u7528\u4e86\u3002","sidebar":"docs"},"button":{"id":"button","title":"Button","description":"\u4e00\u4e2a\u7b80\u5355\u7684\u8de8\u5e73\u53f0\u7684\u6309\u94ae\u7ec4\u4ef6\u3002\u53ef\u4ee5\u8fdb\u884c\u4e00\u4e9b\u7b80\u5355\u7684\u5b9a\u5236\u3002","sidebar":"\u7ec4\u4ef6"},"checkbox":{"id":"checkbox","title":"\ud83d\udea7 CheckBox","description":"Removed. Use one of the community packages instead."},"clipboard":{"id":"clipboard","title":"\ud83d\udea7 Clipboard","description":"Deprecated. Use one of the community packages instead."},"colors":{"id":"colors","title":"\u989c\u8272","description":"React Native \u4e2d\u7684\u7ec4\u4ef6\u662f\u4f7f\u7528 JavaScript \u8fdb\u884c\u6837\u5f0f\u5316\u7684\u3002\u989c\u8272\u5c5e\u6027\u901a\u5e38\u4e0e Web \u4e0a\u7684 CSS \u5de5\u4f5c\u65b9\u5f0f\u76f8\u5339\u914d\u3002\u6bcf\u4e2a\u5e73\u53f0\u4e0a\u5173\u4e8e\u989c\u8272\u4f7f\u7528\u7684\u4e00\u822c\u6307\u5357\u5982\u4e0b\uff1a","sidebar":"docs"},"communication-android":{"id":"communication-android","title":"\u548c\u539f\u751f\u7aef\u901a\u4fe1","description":"\u901a\u8fc7\u690d\u5165\u539f\u751f\u5e94\u7528\u548c\u539f\u751f UI \u7ec4\u4ef6\u4e24\u7bc7\u6587\u6863\uff0c\u6211\u4eec\u5b66\u4e60\u4e86 React Native \u548c\u539f\u751f\u7ec4\u4ef6\u7684\u4e92\u76f8\u6574\u5408\u3002\u5728\u6574\u5408\u7684\u8fc7\u7a0b\u4e2d\uff0c\u6211\u4eec\u4f1a\u9700\u8981\u5728\u4e24\u4e2a\u4e16\u754c\u95f4\u4e92\u76f8\u901a\u4fe1\u3002\u6709\u4e9b\u65b9\u6cd5\u5df2\u7ecf\u5728\u5176\u4ed6\u7684\u6307\u5357\u4e2d\u63d0\u5230\u4e86\uff0c\u8fd9\u7bc7\u6587\u7ae0\u603b\u7ed3\u4e86\u6240\u6709\u53ef\u884c\u7684\u6280\u672f\u3002","sidebar":"docs"},"communication-ios":{"id":"communication-ios","title":"\u548c\u539f\u751f\u7aef\u901a\u4fe1","description":"\u901a\u8fc7\u690d\u5165\u539f\u751f\u5e94\u7528\u548c\u539f\u751f UI \u7ec4\u4ef6\u4e24\u7bc7\u6587\u6863\uff0c\u6211\u4eec\u5b66\u4e60\u4e86 React Native \u548c\u539f\u751f\u7ec4\u4ef6\u7684\u4e92\u76f8\u6574\u5408\u3002\u5728\u6574\u5408\u7684\u8fc7\u7a0b\u4e2d\uff0c\u6211\u4eec\u4f1a\u9700\u8981\u5728\u4e24\u4e2a\u4e16\u754c\u95f4\u4e92\u76f8\u901a\u4fe1\u3002\u6709\u4e9b\u65b9\u6cd5\u5df2\u7ecf\u5728\u5176\u4ed6\u7684\u6307\u5357\u4e2d\u63d0\u5230\u4e86\uff0c\u8fd9\u7bc7\u6587\u7ae0\u603b\u7ed3\u4e86\u6240\u6709\u53ef\u884c\u7684\u6280\u672f\u3002","sidebar":"docs"},"components-and-apis":{"id":"components-and-apis","title":"\u6838\u5fc3\u7ec4\u4ef6\u548cAPI","description":"React Native \u63d0\u4f9b\u4e86\u4e00\u4e9b\u5185\u7f6e\u7684\u6838\u5fc3\u7ec4\u4ef6\u4f9b\u4f60\u4f7f\u7528\u3002\u4f60\u53ef\u4ee5\u5728\u7f51\u7ad9\u7684\u5de6\u4fa7\u770b\u5230\u7ec4\u4ef6\u7684\u5b8c\u6574\u5217\u8868\u3002\u5982\u679c\u4f60\u4e0d\u77e5\u9053\u4ece\u54ea\u770b\u8d77\uff0c\u90a3\u4e48\u53ef\u4ee5\u5148\u770b\u4e00\u4e0b\u4e0b\u9762\u8fd9\u4e2a\u7b80\u5355\u7684\u5206\u7c7b\uff1a","sidebar":"\u7ec4\u4ef6"},"custom-webview-android":{"id":"custom-webview-android","title":"Custom WebView","description":"While the built-in web view has a lot of features, it is not possible to handle every use-case in React Native. You can, however, extend the web view with native code without forking React Native or duplicating all the existing web view code."},"custom-webview-ios":{"id":"custom-webview-ios","title":"Custom WebView","description":"While the built-in web view has a lot of features, it is not possible to handle every use-case in React Native. You can, however, extend the web view with native code without forking React Native or duplicating all the existing web view code."},"datepickerandroid":{"id":"datepickerandroid","title":"\ud83d\udea7 DatePickerAndroid","description":"Deprecated. Use one of the community packages instead."},"datepickerios":{"id":"datepickerios","title":"\ud83d\udea7 DatePickerIOS","description":"Deprecated. Use one of the community packages instead."},"debugging":{"id":"debugging","title":"\u8c03\u8bd5","description":"\u8bbf\u95ee App \u5185\u7684\u5f00\u53d1\u83dc\u5355","sidebar":"docs"},"debugging-native-code":{"id":"debugging-native-code","title":"\u8c03\u8bd5\u539f\u751f\u4ee3\u7801","description":"\u4ec5\u9650\u5305\u542b\u539f\u751f\u4ee3\u7801\u7684\u9879\u76ee","sidebar":"docs"},"debugging-release-builds":{"id":"debugging-release-builds","title":"\u8c03\u8bd5\u53d1\u884c\u7248\u672c","description":"\u7b26\u53f7\u5316\u5806\u6808\u8ddf\u8e2a","sidebar":"docs"},"devsettings":{"id":"devsettings","title":"DevSettings","description":"DevSettings \u6a21\u5757\u53ef\u4ee5\u5bf9\u5f00\u53d1\u8005\u83dc\u5355\u8fdb\u884c\u4e00\u4e9b\u81ea\u5b9a\u4e49\u3002","sidebar":"api"},"dimensions":{"id":"dimensions","title":"Dimensions","description":"\u672c\u6a21\u5757\u7528\u4e8e\u83b7\u53d6\u8bbe\u5907\u5c4f\u5e55\u7684\u5bbd\u9ad8\u3002","sidebar":"api"},"drawerlayoutandroid":{"id":"drawerlayoutandroid","title":"DrawerLayoutAndroid","description":"\u5c01\u88c5\u4e86 Android \u5e73\u53f0DrawerLayout\u7684 React \u7ec4\u4ef6\u3002\u62bd\u5c49\uff08\u901a\u5e38\u7528\u4e8e\u5bfc\u822a\u5207\u6362\uff09\u662f\u901a\u8fc7renderNavigationView\u65b9\u6cd5\u6e32\u67d3\u7684\uff0c\u5e76\u4e14 DrawerLayoutAndroid \u7684\u76f4\u63a5\u5b50\u89c6\u56fe\u4f1a\u6210\u4e3a\u4e3b\u89c6\u56fe\uff08\u7528\u4e8e\u653e\u7f6e\u5185\u5bb9\uff09\u3002\u5bfc\u822a\u89c6\u56fe\u4e00\u5f00\u59cb\u5728\u5c4f\u5e55\u4e0a\u5e76\u4e0d\u53ef\u89c1\uff0c\u4e0d\u8fc7\u53ef\u4ee5\u4ecedrawerPosition\u6307\u5b9a\u7684\u7a97\u53e3\u4fa7\u9762\u62d6\u62fd\u51fa\u6765\uff0c\u5e76\u4e14\u62bd\u5c49\u7684\u5bbd\u5ea6\u53ef\u4ee5\u4f7f\u7528drawerWidth\u5c5e\u6027\u6765\u6307\u5b9a\u3002","sidebar":"\u7ec4\u4ef6"},"dynamiccolorios":{"id":"dynamiccolorios","title":"DynamicColorIOS","description":"DynamicColorIOS\u51fd\u6570\u662f\u4e13\u95e8\u9488\u5bf9iOS\u5e73\u53f0\u7684\u989c\u8272\u7c7b\u578b\u3002","sidebar":"api"},"easing":{"id":"easing","title":"Easing","description":"Easing\u6a21\u5757\u5b9e\u73b0\u4e86\u5e38\u89c1\u7684\u52a8\u753b\u7f13\u52a8\u51fd\u6570\u3002 \u8fd9\u4e2a\u6a21\u5757\u88abAnimated.timing()\u7528\u4e8e\u5728\u52a8\u753b\u4e2d\u4f20\u8fbe\u771f\u5b9e\u53ef\u4fe1\u7684\u8fd0\u52a8\u3002","sidebar":"api"},"environment-setup":{"id":"environment-setup","title":"\u642d\u5efa\u5f00\u53d1\u73af\u5883","description":"\u6b22\u8fce\u4f7f\u7528 React Native\uff01\u8fd9\u7bc7\u6587\u6863\u4f1a\u5e2e\u52a9\u4f60\u642d\u5efa\u57fa\u672c\u7684 React Native \u5f00\u53d1\u73af\u5883\u3002","sidebar":"docs"},"fabric-native-components-android":{"id":"fabric-native-components-android","title":"Fabric Native Modules: Android","description":"\u73b0\u5728\uff0c\u662f\u65f6\u5019\u7f16\u5199\u4e00\u4e9b Android \u5e73\u53f0\u4ee3\u7801\uff0c\u4ee5\u4fbf\u80fd\u591f\u6e32\u67d3 web \u89c6\u56fe\u3002\u4ee5\u4e0b\u662f\u9700\u8981\u7684\u6b65\u9aa4\uff1a"},"fabric-native-components-introduction":{"id":"fabric-native-components-introduction","title":"Fabric Native Components Introduction","description":"\u5982\u679c\u4f60\u60f3\u6784\u5efa\u4e00\u4e2a \u65b0\u67b6\u6784 \u7684 React Native \u7ec4\u4ef6\uff0c\u8be5\u7ec4\u4ef6\u53ef\u4ee5\u5305\u88c5\u4e00\u4e2a Host Component\uff0c\u4f8b\u5982 Android \u4e0a\u7684 CheckBox\uff0c\u6216\u8005 iOS \u4e0a\u7684 UIButton\uff0c\u4f60\u5e94\u8be5\u4f7f\u7528 Fabric \u539f\u751f\u7ec4\u4ef6\u3002","sidebar":"docs"},"fabric-native-components-ios":{"id":"fabric-native-components-ios","title":"Fabric Native Components: iOS","description":"\u73b0\u5728\uff0c\u662f\u65f6\u5019\u7f16\u5199\u4e00\u4e9b iOS \u5e73\u53f0\u4ee3\u7801\uff0c\u4ee5\u4fbf\u80fd\u591f\u6e32\u67d3 web \u89c6\u56fe\u3002\u4ee5\u4e0b\u662f\u9700\u8981\u7684\u6b65\u9aa4\uff1a"},"fabric-renderer":{"id":"fabric-renderer","title":"Fabric \u6e32\u67d3\u5668","description":"Fabric \u662f React Native \u65b0\u67b6\u6784\u7684\u6e32\u67d3\u7cfb\u7edf\uff0c\u662f\u4ece\u8001\u67b6\u6784\u7684\u6e32\u67d3\u7cfb\u7edf\u6f14\u53d8\u800c\u6765\u7684\u3002\u6838\u5fc3\u539f\u7406\u662f\u5728 C++ \u5c42\u7edf\u4e00\u66f4\u591a\u7684\u6e32\u67d3\u903b\u8f91\uff0c\u63d0\u5347\u4e0e\u5bbf\u4e3b\u5e73\u53f0\uff08host platforms\uff09\u4e92\u64cd\u4f5c\u6027\uff0c\u5e76\u4e3a React Native \u89e3\u9501\u66f4\u591a\u80fd\u529b\u3002\u5176\u7814\u53d1\u59cb\u4e8e 2018 \u5e74\u3002\u4ece 2021 \u5e74\u5f00\u59cb\uff0c Facebook App \u4e2d\u7684 React Native \u542f\u7528\u4e86\u65b0\u7684\u6e32\u67d3\u5668\u3002"},"fast-refresh":{"id":"fast-refresh","title":"\u5feb\u901f\u5237\u65b0","description":"\u5feb\u901f\u5237\u65b0\u662f React Native \u4e00\u4e2a\u7279\u6027\uff0c\u5728\u4fee\u6539\u7ec4\u4ef6\u7684\u65f6\u5019\u5feb\u901f\u5237\u65b0\u4f1a\u7ed9\u4f60\u4e00\u4e2a\u5373\u65f6\u7684\u53cd\u9988\u3002\u5feb\u901f\u5237\u65b0\u9ed8\u8ba4\u662f\u5f00\u542f\u7684\uff0c\u53ef\u4ee5\u901a\u8fc7\u8c03\u6574 React Native \u5f00\u53d1\u8005\u83dc\u5355\u91cc\u9762\u7684 \\"Enable Fast Refresh\\" \u6765\u5f00\u542f\u6216\u5173\u95ed\u3002\u5728\u5feb\u901f\u5237\u65b0\u5f00\u542f\u7684\u65f6\u5019\uff0c\u5927\u591a\u6570\u7684\u4fee\u6539\u80fd\u5728\u4e00\u5230\u4e24\u79d2\u4e4b\u5185\u5448\u73b0\u3002","sidebar":"docs"},"flatlist":{"id":"flatlist","title":"FlatList","description":"\u9ad8\u6027\u80fd\u7684\u7b80\u5355\u5217\u8868\u7ec4\u4ef6\uff0c\u652f\u6301\u4e0b\u9762\u8fd9\u4e9b\u5e38\u7528\u7684\u529f\u80fd\uff1a","sidebar":"\u7ec4\u4ef6"},"flexbox":{"id":"flexbox","title":"\u4f7f\u7528 Flexbox \u5e03\u5c40","description":"\u6211\u4eec\u5728 React Native \u4e2d\u4f7f\u7528 flexbox \u89c4\u5219\u6765\u6307\u5b9a\u67d0\u4e2a\u7ec4\u4ef6\u7684\u5b50\u5143\u7d20\u7684\u5e03\u5c40\u3002Flexbox \u53ef\u4ee5\u5728\u4e0d\u540c\u5c4f\u5e55\u5c3a\u5bf8\u4e0a\u63d0\u4f9b\u4e00\u81f4\u7684\u5e03\u5c40\u7ed3\u6784\u3002","sidebar":"docs"},"gesture-responder-system":{"id":"gesture-responder-system","title":"\u624b\u52bf\u54cd\u5e94\u7cfb\u7edf","description":"\u79fb\u52a8\u8bbe\u5907\u4e0a\u7684\u624b\u52bf\u8bc6\u522b\u8981\u6bd4\u5728 web \u4e0a\u590d\u6742\u5f97\u591a\u3002\u7528\u6237\u7684\u4e00\u6b21\u89e6\u6478\u64cd\u4f5c\u7684\u771f\u5b9e\u610f\u56fe\u662f\u4ec0\u4e48\uff0cApp \u8981\u7ecf\u8fc7\u597d\u51e0\u4e2a\u9636\u6bb5\u624d\u80fd\u5224\u65ad\u3002\u6bd4\u5982 App \u9700\u8981\u5224\u65ad\u7528\u6237\u7684\u89e6\u6478\u5230\u5e95\u662f\u5728\u6eda\u52a8\u9875\u9762\uff0c\u8fd8\u662f\u6ed1\u52a8\u4e00\u4e2a widget\uff0c\u6216\u8005\u53ea\u662f\u4e00\u4e2a\u5355\u7eaf\u7684\u70b9\u51fb\u3002\u751a\u81f3\u968f\u7740\u6301\u7eed\u65f6\u95f4\u7684\u4e0d\u540c\uff0c\u8fd9\u4e9b\u64cd\u4f5c\u8fd8\u4f1a\u8f6c\u5316\u3002\u6b64\u5916\uff0c\u8fd8\u6709\u591a\u70b9\u540c\u65f6\u89e6\u63a7\u7684\u60c5\u51b5\u3002","sidebar":"docs"},"getting-started":{"id":"getting-started","title":"\u7b80\u4ecb","description":"\u6b22\u8fce\u5f00\u542f React Native \u7684\u65c5\u7a0b\uff01\u5982\u679c\u4f60\u5728\u627e\u5982\u4f55\u642d\u5efa\u73af\u5883\u7684\u6587\u6863\uff0c\u8bf7\u79fb\u6b65\u642d\u5efa\u5f00\u53d1\u73af\u5883\u3002 \u7ee7\u7eed\u5f80\u4e0b\u9605\u8bfb\u53ef\u4e86\u89e3\u5173\u4e8e\u6587\u6863\u7ed3\u6784\u3001\u539f\u751f\u7ec4\u4ef6\u3001React\u7b49\u76f8\u5173\u7684\u4e00\u4e9b\u4ecb\u7ecd\u3002","sidebar":"docs"},"handling-text-input":{"id":"handling-text-input","title":"\u5904\u7406\u6587\u672c\u8f93\u5165","description":"TextInput\u662f\u4e00\u4e2a\u5141\u8bb8\u7528\u6237\u8f93\u5165\u6587\u672c\u7684\u57fa\u7840\u7ec4\u4ef6\u3002\u5b83\u6709\u4e00\u4e2a\u540d\u4e3aonChangeText\u7684\u5c5e\u6027\uff0c\u6b64\u5c5e\u6027\u63a5\u53d7\u4e00\u4e2a\u51fd\u6570\uff0c\u800c\u6b64\u51fd\u6570\u4f1a\u5728\u6587\u672c\u53d8\u5316\u65f6\u88ab\u8c03\u7528\u3002\u53e6\u5916\u8fd8\u6709\u4e00\u4e2a\u540d\u4e3aonSubmitEditing\u7684\u5c5e\u6027\uff0c\u4f1a\u5728\u6587\u672c\u88ab\u63d0\u4ea4\u540e\uff08\u7528\u6237\u6309\u4e0b\u8f6f\u952e\u76d8\u4e0a\u7684\u63d0\u4ea4\u952e\uff09\u8c03\u7528\u3002","sidebar":"docs"},"handling-touches":{"id":"handling-touches","title":"\u5904\u7406\u89e6\u6478\u4e8b\u4ef6","description":"\u79fb\u52a8\u5e94\u7528\u4e0a\u7684\u7528\u6237\u4ea4\u4e92\u57fa\u672c\u9760\u201c\u6478\u201d\u3002\u5f53\u7136\uff0c\u201c\u6478\u201d\u4e5f\u662f\u6709\u5404\u79cd\u59ff\u52bf\u7684\uff1a\u5728\u4e00\u4e2a\u6309\u94ae\u4e0a\u70b9\u51fb\uff0c\u5728\u4e00\u4e2a\u5217\u8868\u4e0a\u6ed1\u52a8\uff0c\u6216\u662f\u5728\u4e00\u4e2a\u5730\u56fe\u4e0a\u7f29\u653e\u3002React Native \u63d0\u4f9b\u4e86\u53ef\u4ee5\u5904\u7406\u5e38\u89c1\u89e6\u6478\u624b\u52bf\uff08\u4f8b\u5982\u70b9\u51fb\u6216\u6ed1\u52a8\uff09\u7684\u7ec4\u4ef6\uff0c \u4ee5\u53ca\u53ef\u7528\u4e8e\u8bc6\u522b\u66f4\u590d\u6742\u7684\u624b\u52bf\u7684\u5b8c\u6574\u7684\u624b\u52bf\u54cd\u5e94\u7cfb\u7edf\u3002","sidebar":"docs"},"headless-js-android":{"id":"headless-js-android","title":"Headless JS\uff08\u540e\u53f0\u4efb\u52a1\uff09","description":"Headless JS \u662f\u4e00\u79cd\u4f7f\u7528 js \u5728\u540e\u53f0\u6267\u884c\u4efb\u52a1\u7684\u65b9\u6cd5\u3002\u5b83\u53ef\u4ee5\u7528\u6765\u5728\u540e\u53f0\u540c\u6b65\u6570\u636e\u3001\u5904\u7406\u63a8\u9001\u901a\u77e5\u6216\u662f\u64ad\u653e\u97f3\u4e50\u7b49\u7b49\u3002","sidebar":"docs"},"height-and-width":{"id":"height-and-width","title":"\u9ad8\u5ea6\u4e0e\u5bbd\u5ea6","description":"\u7ec4\u4ef6\u7684\u9ad8\u5ea6\u548c\u5bbd\u5ea6\u51b3\u5b9a\u4e86\u5176\u5728\u5c4f\u5e55\u4e0a\u663e\u793a\u7684\u5c3a\u5bf8\u3002","sidebar":"docs"},"hermes":{"id":"hermes","title":"\u4f7f\u7528\u65b0\u7684 Hermes \u5f15\u64ce","description":"Hermes \u662f\u4e13\u95e8\u9488\u5bf9 React Native \u5e94\u7528\u800c\u4f18\u5316\u7684\u5168\u65b0\u5f00\u6e90 JavaScript \u5f15\u64ce\u3002\u5bf9\u4e8e\u5f88\u591a\u5e94\u7528\u6765\u8bf4\uff0c\u542f\u7528 Hermes \u5f15\u64ce\u53ef\u4ee5\u4f18\u5316\u542f\u52a8\u65f6\u95f4\uff0c\u51cf\u5c11\u5185\u5b58\u5360\u7528\u4ee5\u53ca\u7a7a\u95f4\u5360\u7528\u3002\u4ece React Native 0.70 \u7248\u672c\u5f00\u59cb Hermes \u5df2\u7ecf\u9ed8\u8ba4\u542f\u7528\uff0c\u65e0\u9700\u5f00\u53d1\u8005\u518d\u505a\u4efb\u4f55\u914d\u7f6e\u3002","sidebar":"docs"},"image":{"id":"image","title":"Image","description":"\u7528\u4e8e\u663e\u793a\u591a\u79cd\u4e0d\u540c\u7c7b\u578b\u56fe\u7247\u7684 React \u7ec4\u4ef6\uff0c\u5305\u62ec\u7f51\u7edc\u56fe\u7247\u3001\u9759\u6001\u8d44\u6e90\u3001\u4e34\u65f6\u7684\u672c\u5730\u56fe\u7247\u3001\u4ee5\u53ca\u672c\u5730\u78c1\u76d8\u4e0a\u7684\u56fe\u7247\uff08\u5982\u76f8\u518c\uff09\u7b49\u3002","sidebar":"\u7ec4\u4ef6"},"image-style-props":{"id":"image-style-props","title":"\u56fe\u7247\u6837\u5f0f\u5c5e\u6027","description":"\u793a\u4f8b","sidebar":"\u7ec4\u4ef6"},"imagebackground":{"id":"imagebackground","title":"ImageBackground","description":"\u5bf9\u4e8e\u719f\u6089 Web \u5f00\u53d1\u7684\u5f00\u53d1\u4eba\u5458\u6765\u8bf4\uff0cbackground-image\u662f\u4e00\u4e2a\u5e38\u89c1\u7684\u529f\u80fd\u8bf7\u6c42\u3002\u4e3a\u4e86\u5904\u7406\u8fd9\u79cd\u60c5\u51b5\uff0c\u60a8\u53ef\u4ee5\u4f7f\u7528`\u7ec4\u4ef6\uff0c\u5b83\u5177\u6709\u4e0e`\u76f8\u540c\u7684\u5c5e\u6027\uff0c\u5e76\u4e14\u53ef\u4ee5\u6dfb\u52a0\u4efb\u4f55\u5b50\u5143\u7d20\u4ee5\u8986\u76d6\u5728\u5176\u4e0a\u9762\u3002","sidebar":"\u7ec4\u4ef6"},"imagepickerios":{"id":"imagepickerios","title":"\ud83d\udea7 ImagePickerIOS","description":"Deprecated. Use one of the community packages instead."},"images":{"id":"images","title":"\u56fe\u7247","description":"\u9759\u6001\u56fe\u7247\u8d44\u6e90","sidebar":"docs"},"improvingux":{"id":"improvingux","title":"\u6539\u8fdb\u7528\u6237\u4f53\u9a8c","description":"\u914d\u7f6e\u6587\u672c\u8f93\u5165"},"inputaccessoryview":{"id":"inputaccessoryview","title":"InputAccessoryView","description":"\u4e00\u4e2a\u53ef\u4ee5\u5728iOS\u4e0a\u81ea\u5b9a\u4e49\u952e\u76d8\u8f93\u5165\u8f85\u52a9\u89c6\u56fe\u7684\u7ec4\u4ef6\u3002\u5f53TextInput\u83b7\u5f97\u7126\u70b9\u65f6\uff0c\u8f93\u5165\u8f85\u52a9\u89c6\u56fe\u663e\u793a\u5728\u952e\u76d8\u4e0a\u65b9\u3002\u8be5\u7ec4\u4ef6\u53ef\u7528\u4e8e\u521b\u5efa\u81ea\u5b9a\u4e49\u5de5\u5177\u680f\u3002","sidebar":"\u7ec4\u4ef6"},"integration-with-android-fragment":{"id":"integration-with-android-fragment","title":"\u96c6\u6210\u5230 Android Fragment","description":"\u4e0e\u73b0\u6709\u5e94\u7528\u7a0b\u5e8f\u96c6\u6210\u6307\u5357\u4e2d\u8be6\u7ec6\u4ecb\u7ecd\u4e86\u5982\u4f55\u5c06\u5168\u5c4f React Native \u5e94\u7528\u7a0b\u5e8f\u4f5c\u4e3a Activity \u96c6\u6210\u5230\u73b0\u6709 Android \u5e94\u7528\u7a0b\u5e8f\u4e2d\u3002\u8981\u5728\u73b0\u6709\u5e94\u7528\u7a0b\u5e8f\u7684 Fragments \u4e2d\u4f7f\u7528 React Native \u7ec4\u4ef6\uff0c\u9700\u8981\u8fdb\u884c\u4e00\u4e9b\u989d\u5916\u7684\u8bbe\u7f6e\u3002\u8fd9\u6837\u505a\u7684\u597d\u5904\u662f\u5b83\u5141\u8bb8\u539f\u751f\u5e94\u7528\u7a0b\u5e8f\u5c06 React Native \u7ec4\u4ef6\u4e0e Activity \u4e2d\u7684\u539f\u751f Fragments \u96c6\u6210\u5728\u4e00\u8d77\u3002","sidebar":"docs"},"integration-with-existing-apps":{"id":"integration-with-existing-apps","title":"\u96c6\u6210\u5230\u73b0\u6709\u539f\u751f\u5e94\u7528","description":"\u5982\u679c\u4f60\u6b63\u51c6\u5907\u4ece\u5934\u5f00\u59cb\u5236\u4f5c\u4e00\u4e2a\u65b0\u7684\u5e94\u7528\uff0c\u90a3\u4e48 React Native \u4f1a\u662f\u4e2a\u975e\u5e38\u597d\u7684\u9009\u62e9\u3002\u4f46\u5982\u679c\u4f60\u53ea\u60f3\u7ed9\u73b0\u6709\u7684\u539f\u751f\u5e94\u7528\u4e2d\u6dfb\u52a0\u4e00\u4e24\u4e2a\u89c6\u56fe\u6216\u662f\u4e1a\u52a1\u6d41\u7a0b\uff0cReact Native \u4e5f\u540c\u6837\u4e0d\u5728\u8bdd\u4e0b\u3002\u53ea\u9700\u7b80\u5355\u51e0\u6b65\uff0c\u4f60\u5c31\u53ef\u4ee5\u7ed9\u539f\u6709\u5e94\u7528\u52a0\u4e0a\u65b0\u7684\u57fa\u4e8e React Native \u7684\u7279\u6027\u3001\u753b\u9762\u548c\u89c6\u56fe\u7b49\u3002","sidebar":"docs"},"interactionmanager":{"id":"interactionmanager","title":"InteractionManager","description":"Interactionmanager \u53ef\u4ee5\u5c06\u4e00\u4e9b\u8017\u65f6\u8f83\u957f\u7684\u5de5\u4f5c\u5b89\u6392\u5230\u6240\u6709\u4e92\u52a8\u6216\u52a8\u753b\u5b8c\u6210\u4e4b\u540e\u518d\u8fdb\u884c\u3002\u8fd9\u6837\u53ef\u4ee5\u4fdd\u8bc1 JavaScript \u52a8\u753b\u7684\u6d41\u7545\u8fd0\u884c\u3002","sidebar":"api"},"intro-react":{"id":"intro-react","title":"React \u57fa\u7840","description":"\u8981\u6df1\u5165\u7406\u89e3 React Native\uff0c\u9700\u8981\u624e\u5b9e\u7684React \u57fa\u7840\u77e5\u8bc6\u3002\u8fd9\u7bc7\u5c0f\u6559\u7a0b\u53ef\u4ee5\u5e2e\u52a9\u4f60\u5165\u95e8\u6216\u8005\u6e29\u4e60\u76f8\u5173\u77e5\u8bc6\u3002","sidebar":"docs"},"intro-react-native-components":{"id":"intro-react-native-components","title":"\u6838\u5fc3\u7ec4\u4ef6\u4e0e\u539f\u751f\u7ec4\u4ef6","description":"React Native \u4f7f\u7528\u5b8c\u5168\u539f\u751f\u7684\u7ec4\u4ef6\u6765\u6784\u5efa\u5e94\u7528\u754c\u9762\u3002\u5c24\u5176\u65b9\u4fbf\u7684\u662f\u5b83\u5df2\u7ecf\u5185\u7f6e\u4e86\u5927\u91cf\u76f4\u63a5\u4e0a\u624b\u53ef\u7528\u7684\u6838\u5fc3\u7ec4\u4ef6\u3002","sidebar":"docs"},"javascript-environment":{"id":"javascript-environment","title":"JavaScript \u73af\u5883","description":"JavaScript \u8fd0\u884c\u65f6\u73af\u5883","sidebar":"docs"},"keyboard":{"id":"keyboard","title":"Keyboard","description":"Keyboard\u6a21\u5757\u7528\u6765\u63a7\u5236\u952e\u76d8\u76f8\u5173\u7684\u4e8b\u4ef6\u3002","sidebar":"api"},"keyboardavoidingview":{"id":"keyboardavoidingview","title":"KeyboardAvoidingView","description":"\u672c\u7ec4\u4ef6\u7528\u4e8e\u89e3\u51b3\u4e00\u4e2a\u5e38\u89c1\u7684\u5c34\u5c2c\u95ee\u9898\uff1a\u624b\u673a\u4e0a\u5f39\u51fa\u7684\u952e\u76d8\u5e38\u5e38\u4f1a\u6321\u4f4f\u5f53\u524d\u7684\u89c6\u56fe\u3002\u672c\u7ec4\u4ef6\u53ef\u4ee5\u81ea\u52a8\u6839\u636e\u952e\u76d8\u7684\u9ad8\u5ea6\uff0c\u8c03\u6574\u81ea\u8eab\u7684 height \u6216\u5e95\u90e8\u7684 padding\uff0c\u4ee5\u907f\u514d\u88ab\u906e\u6321\u3002","sidebar":"\u7ec4\u4ef6"},"layout-props":{"id":"layout-props","title":"\u5e03\u5c40\u5c5e\u6027","description":"\u66f4\u591a\u5173\u4e8e\u8fd9\u4e9b\u5c5e\u6027\u7684\u8be6\u7ec6\u793a\u4f8b\u53ef\u4ee5\u5728Flexbox \u5e03\u5c40\u9875\u9762\u4e0a\u627e\u5230\u3002","sidebar":"\u7ec4\u4ef6"},"layoutanimation":{"id":"layoutanimation","title":"LayoutAnimation","description":"\u5f53\u5e03\u5c40\u53d8\u5316\u65f6\uff0c\u81ea\u52a8\u5c06\u89c6\u56fe\u8fd0\u52a8\u5230\u5b83\u4eec\u65b0\u7684\u4f4d\u7f6e\u4e0a\u3002","sidebar":"api"},"layoutevent":{"id":"layoutevent","title":"\u5e03\u5c40\u4e8b\u4ef6\u5bf9\u8c61","description":"LayoutEvent object is returned in the callback as a result of component layout change, for example onLayout in View component.","sidebar":"\u7ec4\u4ef6"},"legacy/direct-manipulation":{"id":"legacy/direct-manipulation","title":"\u76f4\u63a5\u64cd\u4f5c","description":"\u6709\u65f6\u5019\u6211\u4eec\u9700\u8981\u76f4\u63a5\u6539\u52a8\u7ec4\u4ef6\u5e76\u89e6\u53d1\u5c40\u90e8\u7684\u5237\u65b0\uff0c\u4f46\u4e0d\u4f7f\u7528 state \u6216\u662f props\u3002\u8b6c\u5982\u5728\u6d4f\u89c8\u5668\u4e2d\u4f7f\u7528 React \u5e93\uff0c\u6709\u65f6\u5019\u4f1a\u9700\u8981\u76f4\u63a5\u4fee\u6539\u4e00\u4e2a DOM \u8282\u70b9\uff0c\u800c\u5728\u624b\u673a App \u4e2d\u64cd\u4f5c View \u65f6\u4e5f\u4f1a\u78b0\u5230\u540c\u6837\u7684\u60c5\u51b5\u3002\u5728 React Native \u4e2d\uff0csetNativeProps\u5c31\u662f\u7b49\u4ef7\u4e8e\u76f4\u63a5\u64cd\u4f5c DOM \u8282\u70b9\u7684\u65b9\u6cd5\u3002","sidebar":"docs"},"legacy/local-library-setup":{"id":"legacy/local-library-setup","title":"Local libraries setup","description":"A local library is a library containing views or modules that\'s local to your app and not published to a registry. This is different from the traditional setup for view and modules in the sense that a local library is decoupled from your app\'s native code.","sidebar":"docs"},"legacy/native-components-android":{"id":"legacy/native-components-android","title":"Android \u539f\u751fUI\u7ec4\u4ef6","description":"\u5728\u5982\u4eca\u7684 App \u4e2d\uff0c\u5df2\u7ecf\u6709\u6210\u5343\u4e0a\u4e07\u7684\u539f\u751f UI \u90e8\u4ef6\u4e86\u2014\u2014\u5176\u4e2d\u7684\u4e00\u4e9b\u662f\u5e73\u53f0\u7684\u4e00\u90e8\u5206\uff0c\u53e6\u4e00\u4e9b\u53ef\u80fd\u6765\u81ea\u4e8e\u4e00\u4e9b\u7b2c\u4e09\u65b9\u5e93\uff0c\u800c\u4e14\u53ef\u80fd\u4f60\u81ea\u5df1\u8fd8\u6536\u85cf\u4e86\u5f88\u591a\u3002React Native \u5df2\u7ecf\u5c01\u88c5\u4e86\u5927\u90e8\u5206\u6700\u5e38\u89c1\u7684\u7ec4\u4ef6\uff0c\u8b6c\u5982ScrollView\u548cTextInput\uff0c\u4f46\u4e0d\u53ef\u80fd\u5c01\u88c5\u5168\u90e8\u7ec4\u4ef6\u3002\u800c\u4e14\uff0c\u8bf4\u4e0d\u5b9a\u4f60\u66fe\u7ecf\u4e3a\u81ea\u5df1\u4ee5\u524d\u7684 App \u8fd8\u5c01\u88c5\u8fc7\u4e00\u4e9b\u7ec4\u4ef6\uff0cReact Native \u80af\u5b9a\u6ca1\u6cd5\u5305\u542b\u5b83\u4eec\u3002\u5e78\u8fd0\u7684\u662f\uff0c\u5728 React Naitve \u5e94\u7528\u7a0b\u5e8f\u4e2d\u5c01\u88c5\u548c\u690d\u5165\u5df2\u6709\u7684\u7ec4\u4ef6\u975e\u5e38\u7b80\u5355\u3002","sidebar":"docs"},"legacy/native-components-ios":{"id":"legacy/native-components-ios","title":"iOS \u539f\u751fUI\u7ec4\u4ef6","description":"\u5728\u5982\u4eca\u7684 App \u4e2d\uff0c\u5df2\u7ecf\u6709\u6210\u5343\u4e0a\u4e07\u7684\u539f\u751f UI \u90e8\u4ef6\u4e86\u2014\u2014\u5176\u4e2d\u7684\u4e00\u4e9b\u662f\u5e73\u53f0\u7684\u4e00\u90e8\u5206\uff0c\u53e6\u4e00\u4e9b\u53ef\u80fd\u6765\u81ea\u4e8e\u4e00\u4e9b\u7b2c\u4e09\u65b9\u5e93\uff0c\u800c\u4e14\u53ef\u80fd\u4f60\u81ea\u5df1\u8fd8\u6536\u85cf\u4e86\u5f88\u591a\u3002React Native \u5df2\u7ecf\u5c01\u88c5\u4e86\u5927\u90e8\u5206\u6700\u5e38\u89c1\u7684\u7ec4\u4ef6\uff0c\u8b6c\u5982ScrollView\u548cTextInput\uff0c\u4f46\u4e0d\u53ef\u80fd\u5c01\u88c5\u5168\u90e8\u7ec4\u4ef6\u3002\u800c\u4e14\uff0c\u8bf4\u4e0d\u5b9a\u4f60\u66fe\u7ecf\u4e3a\u81ea\u5df1\u4ee5\u524d\u7684 App \u8fd8\u5c01\u88c5\u8fc7\u4e00\u4e9b\u7ec4\u4ef6\uff0cReact Native \u80af\u5b9a\u6ca1\u6cd5\u5305\u542b\u5b83\u4eec\u3002\u5e78\u8fd0\u7684\u662f\uff0c\u5728 React Naitve \u5e94\u7528\u7a0b\u5e8f\u4e2d\u5c01\u88c5\u548c\u690d\u5165\u5df2\u6709\u7684\u7ec4\u4ef6\u975e\u5e38\u7b80\u5355\u3002","sidebar":"docs"},"legacy/native-modules-android":{"id":"legacy/native-modules-android","title":"Android \u539f\u751f\u6a21\u5757","description":"\u6b22\u8fce\u6765\u5230 Android \u7684\u539f\u751f\u6a21\u5757\u3002\u8bf7\u5148\u9605\u8bfb \u539f\u751f\u6a21\u5757\u7b80\u4ecb \u4ee5\u4e86\u89e3\u539f\u751f\u6a21\u5757\u7684\u57fa\u672c\u6982\u5ff5\u3002","sidebar":"docs"},"legacy/native-modules-intro":{"id":"legacy/native-modules-intro","title":"\u539f\u751f\u6a21\u5757\u7b80\u4ecb","description":"\u6709\u65f6\u5019 App \u9700\u8981\u8bbf\u95ee\u5e73\u53f0 API\uff0c\u4f46 React Native \u53ef\u80fd\u8fd8\u6ca1\u6709\u76f8\u5e94\u7684\u6a21\u5757\u5305\u88c5\uff1b\u6216\u8005\u4f60\u9700\u8981\u590d\u7528\u4e00\u4e9b Java \u4ee3\u7801\uff0c\u800c\u4e0d\u662f\u7528 Javascript \u91cd\u65b0\u5b9e\u73b0\u4e00\u904d\uff1b\u53c8\u6216\u8005\u4f60\u9700\u8981\u5b9e\u73b0\u67d0\u4e9b\u9ad8\u6027\u80fd\u7684\u3001\u591a\u7ebf\u7a0b\u7684\u4ee3\u7801\uff0c\u8b6c\u5982\u56fe\u7247\u5904\u7406\u3001\u6570\u636e\u5e93\u3001\u6216\u8005\u5404\u79cd\u9ad8\u7ea7\u6269\u5c55\u7b49\u7b49\u3002","sidebar":"docs"},"legacy/native-modules-ios":{"id":"legacy/native-modules-ios","title":"iOS \u539f\u751f\u6a21\u5757","description":"\u6709\u65f6\u5019 App \u9700\u8981\u8bbf\u95ee\u5e73\u53f0 API\uff0c\u4f46 React Native \u53ef\u80fd\u8fd8\u6ca1\u6709\u76f8\u5e94\u7684\u6a21\u5757\u5c01\u88c5\uff1b\u6216\u8005\u4f60\u9700\u8981\u590d\u7528 Objective-C\u3001Swift \u6216 C++\u4ee3\u7801\uff0c\u800c\u4e0d\u662f\u7528 JavaScript \u91cd\u65b0\u5b9e\u73b0\u4e00\u904d\uff1b\u53c8\u6216\u8005\u4f60\u9700\u8981\u5b9e\u73b0\u67d0\u4e9b\u9ad8\u6027\u80fd\u3001\u591a\u7ebf\u7a0b\u7684\u4ee3\u7801\uff0c\u8b6c\u5982\u56fe\u7247\u5904\u7406\u3001\u6570\u636e\u5e93\u3001\u6216\u8005\u5404\u79cd\u9ad8\u7ea7\u6269\u5c55\u7b49\u7b49\u3002","sidebar":"docs"},"legacy/native-modules-setup":{"id":"legacy/native-modules-setup","title":"Native Modules NPM Package Setup","description":"Native modules are usually distributed as npm packages, except that on top of the usual JavaScript they will include some native code per platform. To understand more about npm packages you may find this guide useful.","sidebar":"docs"},"libraries":{"id":"libraries","title":"\u4f7f\u7528\u7b2c\u4e09\u65b9\u5e93","description":"This guide introduces React Native developers to finding, installing, and using third-party libraries in their apps.","sidebar":"docs"},"linking":{"id":"linking","title":"Linking","description":"Linking\u63d0\u4f9b\u4e86\u4e00\u4e2a\u901a\u7528\u7684\u63a5\u53e3\u6765\u4e0e\u4f20\u5165\u548c\u4f20\u51fa\u7684 App \u94fe\u63a5\u8fdb\u884c\u4ea4\u4e92\u3002","sidebar":"api"},"linking-libraries-ios":{"id":"linking-libraries-ios","title":"\u94fe\u63a5\u539f\u751f\u5e93","description":"\u5e76\u4e0d\u662f\u6240\u6709\u7684 APP \u90fd\u9700\u8981\u4f7f\u7528\u5168\u90e8\u7684\u539f\u751f\u529f\u80fd\uff0c\u5305\u542b\u652f\u6301\u5168\u90e8\u7279\u6027\u7684\u4ee3\u7801\u4f1a\u589e\u5927\u5e94\u7528\u7684\u4f53\u79ef\u3002\u4f46\u6211\u4eec\u4ecd\u7136\u5e0c\u671b\u80fd\u8ba9\u4f60\u7b80\u5355\u5730\u6839\u636e\u81ea\u5df1\u7684\u9700\u6c42\u6dfb\u52a0\u9700\u8981\u7684\u7279\u6027\u3002","sidebar":"docs"},"metro":{"id":"metro","title":"Metro","description":"React Native \u4f7f\u7528Metro\u6784\u5efa JavaScript \u4ee3\u7801\u548c\u8d44\u6e90\u3002","sidebar":"docs"},"modal":{"id":"modal","title":"Modal","description":"Modal \u7ec4\u4ef6\u662f\u4e00\u79cd\u7b80\u5355\u7684\u8986\u76d6\u5728\u5176\u4ed6\u89c6\u56fe\u4e4b\u4e0a\u663e\u793a\u5185\u5bb9\u7684\u65b9\u5f0f\u3002","sidebar":"\u7ec4\u4ef6"},"more-resources":{"id":"more-resources","title":"\u5176\u4ed6\u53c2\u8003\u8d44\u6e90","description":"\u5982\u679c\u4f60\u8010\u5fc3\u7684\u8bfb\u5b8c\u5e76\u7406\u89e3\u4e86\u672c\u7f51\u7ad9\u4e0a\u7684\u6240\u6709\u6587\u6863\uff0c\u90a3\u4e48\u4f60\u5e94\u8be5\u5df2\u7ecf\u53ef\u4ee5\u7f16\u5199\u4e00\u4e2a\u50cf\u6837\u7684 React Native \u5e94\u7528\u4e86\u3002\u4f46\u662f React Native \u5e76\u4e0d\u5168\u662f\u67d0\u4e00\u5bb6\u516c\u53f8\u7684\u4f5c\u54c1\u2014\u2014\u5b83\u6c47\u805a\u4e86\u6210\u5343\u4e0a\u4e07\u5f00\u6e90\u793e\u533a\u5f00\u53d1\u8005\u7684\u667a\u6167\u7ed3\u6676\u3002\u5982\u679c\u4f60\u60f3\u6df1\u5165\u7814\u7a76 React Native\uff0c\u90a3\u4e48\u5efa\u8bae\u4e0d\u8981\u9519\u8fc7\u4e0b\u9762\u8fd9\u4e9b\u53c2\u8003\u8d44\u6e90\u3002","sidebar":"docs"},"native-platform":{"id":"native-platform","title":"\u6865\u63a5\u539f\u751f\u5e73\u53f0\u80fd\u529b","description":"\u4f60\u7684\u5e94\u7528\u53ef\u80fd\u9700\u8981\u8bbf\u95ee React Native \u6216\u793e\u533a\u7ef4\u62a4\u7684\u6570\u767e\u4e2a \u7b2c\u4e09\u65b9\u5e93 \u4e2d\u672a\u76f4\u63a5\u63d0\u4f9b\u7684\u5e73\u53f0\u529f\u80fd\u3002\u4e5f\u8bb8\u4f60\u60f3\u8981\u91cd\u7528\u4e00\u4e9b\u73b0\u6709\u7684 Objective-C\u3001Swift\u3001Java\u3001Kotlin \u6216 C++ \u4ee3\u7801\u3002\u65e0\u8bba\u4f60\u7684\u539f\u56e0\u662f\u4ec0\u4e48\uff0cReact Native \u90fd\u63d0\u4f9b\u4e86\u4e00\u7ec4\u5f3a\u5927\u7684 API \u6765\u8fde\u63a5\u4f60\u7684\u539f\u751f\u4ee3\u7801\u548c JavaScript \u5e94\u7528\u4ee3\u7801\u3002","sidebar":"docs"},"navigation":{"id":"navigation","title":"\u4f7f\u7528\u5bfc\u822a\u5668\u8df3\u8f6c\u9875\u9762","description":"\u79fb\u52a8\u5e94\u7528\u57fa\u672c\u4e0d\u4f1a\u53ea\u7531\u4e00\u4e2a\u9875\u9762\u7ec4\u6210\u3002\u7ba1\u7406\u591a\u4e2a\u9875\u9762\u7684\u5448\u73b0\u3001\u8df3\u8f6c\u7684\u7ec4\u4ef6\u5c31\u662f\u6211\u4eec\u901a\u5e38\u6240\u8bf4\u7684\u5bfc\u822a\u5668\uff08navigator\uff09\u3002","sidebar":"docs"},"netinfo":{"id":"netinfo","title":"NetInfo","description":"\u5df2\u8fc7\u65f6\u3002 Use react-native-community/react-native-netinfo instead."},"network":{"id":"network","title":"\u8bbf\u95ee\u7f51\u7edc","description":"\u5f88\u591a\u79fb\u52a8\u5e94\u7528\u90fd\u9700\u8981\u4ece\u8fdc\u7a0b\u5730\u5740\u4e2d\u83b7\u53d6\u6570\u636e\u6216\u8d44\u6e90\u3002\u4f60\u53ef\u80fd\u9700\u8981\u7ed9\u67d0\u4e2a REST API \u53d1\u8d77 POST \u8bf7\u6c42\u4ee5\u63d0\u4ea4\u7528\u6237\u6570\u636e\uff0c\u53c8\u6216\u8005\u53ef\u80fd\u4ec5\u4ec5\u9700\u8981\u4ece\u67d0\u4e2a\u670d\u52a1\u5668\u4e0a\u83b7\u53d6\u4e00\u4e9b\u9759\u6001\u5185\u5bb9\u2014\u2014\u4ee5\u4e0b\u5c31\u662f\u4f60\u4f1a\u7528\u5230\u7684\u4e1c\u897f\u3002\u65b0\u624b\u53ef\u4ee5\u5bf9\u7167\u8fd9\u4e2a\u7b80\u77ed\u7684\u89c6\u9891\u6559\u7a0b\u52a0\u6df1\u7406\u89e3\u3002","sidebar":"docs"},"new-architecture-app-intro":{"id":"new-architecture-app-intro","title":"\u5728\u5e94\u7528\u4e2d\u542f\u7528\u7684\u9884\u5907\u5de5\u4f5c","description":"\u5728\u542f\u7528\u65b0\u67b6\u6784\u4e4b\u524d\uff0c\u5e94\u5148\u6ee1\u8db3\u4e00\u4e9b\u5148\u51b3\u6761\u4ef6\u3002"},"new-architecture-app-modules-ios":{"id":"new-architecture-app-modules-ios","title":"\u5728 iOS \u4e0a\u542f\u7528 TurboModule","description":"Make sure your application meets all the prerequisites."},"new-architecture-app-renderer-android":{"id":"new-architecture-app-renderer-android","title":"\u5728 Android \u4e0a\u542f\u7528 Fabric","description":"Make sure your application meets all the prerequisites."},"new-architecture-app-renderer-ios":{"id":"new-architecture-app-renderer-ios","title":"\u5728 iOS \u4e0a\u542f\u7528 Fabric","description":"This section will go over how to enable the new renderer in your app. Make sure your application meets all the prerequisites."},"new-architecture-intro":{"id":"new-architecture-intro","title":"\u8fc1\u79fb\u5230\u65b0\u67b6\u6784","description":"\u6b64\u8fc1\u79fb\u6307\u5357\u65e8\u5728\u4e3aReact Native\u7684\u5e93\u4f5c\u8005\u548c\u5e94\u7528\u7a0b\u5e8f\u5f00\u53d1\u8005\u63d0\u4f9b\u3002\u5b83\u6982\u8ff0\u4e86\u60a8\u9700\u8981\u9075\u5faa\u7684\u6b65\u9aa4\uff0c\u4ee5\u5728\u60a8\u7684Android\u548ciOS\u5e93\u548c\u5e94\u7528\u4e2d\u4f7f\u7528\u7531\u65b0\u7684NativeModule\u7cfb\u7edf\uff08TurboModule\uff09\u548c\u65b0\u7684\u6e32\u67d3\u5668\uff08Fabric\uff09\u7ec4\u6210\u7684\u65b0\u67b6\u6784\u3002"},"new-architecture-library-android":{"id":"new-architecture-library-android","title":"\u5728 Android \u5e93\u4e2d\u542f\u7528","description":"\u4e00\u65e6\u60a8\u5728\u5148\u51b3\u6761\u4ef6\u4e2d\u5b9a\u4e49\u4e86\u672c\u673a\u6a21\u5757\u7684 JavaScript \u89c4\u8303\uff0c\u8bbe\u7f6e\u4e86 CodeGen \u914d\u7f6e\uff0c\u5e76\u9075\u5faa\u4e86 Android/Gradle \u8bbe\u7f6e\uff0c\u7136\u540e\u5c31\u53ef\u4ee5\u5c06\u60a8\u7684\u5e93\u8fc1\u79fb\u5230\u65b0\u67b6\u6784\u3002\u4ee5\u4e0b\u662f\u8fc1\u79fb\u6240\u9700\u7684\u6b65\u9aa4\u3002"},"new-architecture-library-intro":{"id":"new-architecture-library-intro","title":"\u5728\u5e93\u4e2d\u542f\u7528\u7684\u9884\u5907\u5de5\u4f5c","description":"The following steps will help ensure your modules and components are ready for the New Architecture."},"new-architecture-library-ios":{"id":"new-architecture-library-ios","title":"\u5728 iOS \u5e93\u4e2d\u542f\u7528","description":"You have defined the JavaScript specs for your native modules as part of the prerequisites, and you are now ready to migrate your library to the New Architecture. Here are the steps you can follow to accomplish this."},"new-architecture-troubleshooting":{"id":"new-architecture-troubleshooting","title":"\u5e38\u89c1\u95ee\u9898","description":"\u672c\u9875\u9762\u4f1a\u8bb0\u5f55\u4e00\u4e9b\u8fc1\u79fb\u5230\u65b0\u67b6\u6784\u65f6\u53ef\u80fd\u9047\u5230\u7684\u5e38\u89c1\u95ee\u9898\u7684\u89e3\u51b3\u65b9\u6848\u3002"},"new-architecture-turbo-modules":{"id":"new-architecture-turbo-modules","title":"\u65b0\u67b6\u6784\u7684\u539f\u751f\u6a21\u5757\uff08Turbo Module\uff09","description":"If you\'ve worked with React Native, you may be familiar with the concept of Native Modules, which allow JavaScript and platform-native code to communicate over the React Native \\"bridge\\", which handles cross-platform serialization via JSON."},"optimizing-flatlist-configuration":{"id":"optimizing-flatlist-configuration","title":"\u5217\u8868\u914d\u7f6e\u4f18\u5316","description":"\u672f\u8bed\u5b9a\u4e49","sidebar":"docs"},"optimizing-javascript-loading":{"id":"optimizing-javascript-loading","title":"Optimizing JavaScript loading","description":"\u89e3\u6790\u548c\u8fd0\u884c JavaScript \u4ee3\u7801\u9700\u8981\u5185\u5b58\u548c\u65f6\u95f4\u3002\u56e0\u6b64\uff0c\u968f\u7740\u4f60\u7684\u5e94\u7528\u7a0b\u5e8f\u589e\u957f\uff0c\u901a\u5e38\u5c06\u4ee3\u7801\u52a0\u8f7d\u5ef6\u8fdf\u5230\u9996\u6b21\u9700\u8981\u65f6\u662f\u6709\u7528\u7684\u3002React Native \u81ea\u5e26\u4e00\u4e9b\u9ed8\u8ba4\u5f00\u542f\u7684\u6807\u51c6\u4f18\u5316\uff0c\u5e76\u4e14\u4f60\u53ef\u4ee5\u5728\u81ea\u5df1\u7684\u4ee3\u7801\u4e2d\u91c7\u7528\u4e00\u4e9b\u6280\u672f\u6765\u5e2e\u52a9 React \u66f4\u6709\u6548\u5730\u52a0\u8f7d\u4f60\u7684\u5e94\u7528\u7a0b\u5e8f\u3002\u8fd8\u6709\u4e00\u4e9b\u9002\u5408\u975e\u5e38\u5927\u5e94\u7528\u7a0b\u5e8f\u7684\u9ad8\u7ea7\u81ea\u52a8\u4f18\u5316\uff08\u5b83\u4eec\u4e5f\u6709\u81ea\u5df1\u7684\u6743\u8861\uff09\u3002","sidebar":"docs"},"other-debugging-methods":{"id":"other-debugging-methods","title":"\u5176\u4ed6\u8c03\u8bd5\u65b9\u6cd5","description":"\u6b64\u9875\u9762\u4ecb\u7ecd\u4e86\u9664 \u6253\u5f00\u8c03\u8bd5\u5668 \u4e2d\u63cf\u8ff0\u7684\u65b9\u6cd5\u4e4b\u5916\u7684\u5176\u4ed6 JavaScript \u8c03\u8bd5\u65b9\u6cd5\u3002\u5982\u679c\u4f60\u6b63\u5728\u4f7f\u7528\u65b0\u521b\u5efa\u7684 React Native \u6216 Expo \u5e94\u7528\uff0c\u6211\u4eec\u5efa\u8bae\u4ece\u90a3\u91cc\u5f00\u59cb\u3002","sidebar":"docs"},"out-of-tree-platforms":{"id":"out-of-tree-platforms","title":"\u591a\u5e73\u53f0\u652f\u6301","description":"React Native\u4e0d\u4ec5\u9002\u7528\u4e8e Android \u548c iOS - \u8fd8\u6709\u793e\u533a\u652f\u6301\u7684\u9879\u76ee\u5c06\u5176\u5e94\u7528\u4e8e\u5176\u4ed6\u5e73\u53f0\uff0c\u4f8b\u5982\uff1a","sidebar":"docs"},"panresponder":{"id":"panresponder","title":"PanResponder","description":"PanResponder\u7c7b\u53ef\u4ee5\u5c06\u591a\u70b9\u89e6\u6478\u64cd\u4f5c\u534f\u8c03\u6210\u4e00\u4e2a\u624b\u52bf\u3002\u5b83\u4f7f\u5f97\u4e00\u4e2a\u5355\u70b9\u89e6\u6478\u53ef\u4ee5\u63a5\u53d7\u66f4\u591a\u7684\u89e6\u6478\u64cd\u4f5c\uff0c\u4e5f\u53ef\u4ee5\u7528\u4e8e\u8bc6\u522b\u7b80\u5355\u7684\u591a\u70b9\u89e6\u6478\u624b\u52bf\u3002","sidebar":"api"},"performance":{"id":"performance","title":"\u6027\u80fd\u7efc\u8ff0","description":"\u4f7f\u7528 React Native \u66ff\u4ee3\u57fa\u4e8e WebView \u7684\u6846\u67b6\u6765\u5f00\u53d1 App \u7684\u4e00\u4e2a\u5f3a\u6709\u529b\u7684\u7406\u7531\uff0c\u5c31\u662f\u4e3a\u4e86\u4f7f App \u53ef\u4ee5\u8fbe\u5230\u6bcf\u79d2 60 \u5e27\uff08\u8db3\u591f\u6d41\u7545\uff09\uff0c\u5e76\u4e14\u80fd\u6709\u7c7b\u4f3c\u539f\u751f App \u7684\u5916\u89c2\u548c\u624b\u611f\u3002\u56e0\u6b64\u6211\u4eec\u4e5f\u5c3d\u53ef\u80fd\u5730\u4f18\u5316 React Native \u53bb\u5b9e\u73b0\u8fd9\u4e00\u76ee\u6807\uff0c\u4f7f\u5f00\u53d1\u8005\u80fd\u96c6\u4e2d\u7cbe\u529b\u5904\u7406 App \u7684\u4e1a\u52a1\u903b\u8f91\uff0c\u800c\u4e0d\u7528\u8d39\u5fc3\u8003\u8651\u6027\u80fd\u3002\u4f46\u662f\uff0c\u603b\u8fd8\u662f\u6709\u4e00\u4e9b\u5730\u65b9\u6709\u6240\u6b20\u7f3a\uff0c\u4ee5\u53ca\u5728\u67d0\u4e9b\u573a\u5408 React Native \u8fd8\u4e0d\u80fd\u591f\u66ff\u4f60\u51b3\u5b9a\u5982\u4f55\u8fdb\u884c\u4f18\u5316\uff08\u7528\u539f\u751f\u4ee3\u7801\u5199\u4e5f\u65e0\u6cd5\u907f\u514d\uff09\uff0c\u56e0\u6b64\u4eba\u5de5\u7684\u5e72\u9884\u4f9d\u7136\u662f\u5fc5\u8981\u7684\u3002","sidebar":"docs"},"permissionsandroid":{"id":"permissionsandroid","title":"PermissionsAndroid","description":"\u4ec5\u9002\u7528\u4e8e\u975e\u6c99\u76d2\u9879\u76ee","sidebar":"api"},"pixelratio":{"id":"pixelratio","title":"PixelRatio","description":"PixelRatio \u53ef\u4ee5\u83b7\u53d6\u5230\u8bbe\u5907\u7684\u50cf\u7d20\u5bc6\u5ea6\u548c\u5b57\u4f53\u7f29\u653e\u6bd4\u3002","sidebar":"api"},"platform":{"id":"platform","title":"Platform","description":"Example","sidebar":"api"},"platform-specific-code":{"id":"platform-specific-code","title":"\u7279\u5b9a\u5e73\u53f0\u4ee3\u7801","description":"\u5728\u7f16\u5199\u8de8\u5e73\u53f0\u7684\u5e94\u7528\u65f6\uff0c\u6211\u4eec\u80af\u5b9a\u5e0c\u671b\u5c3d\u53ef\u80fd\u591a\u5730\u590d\u7528\u4ee3\u7801\u3002\u4f46\u662f\u603b\u6709\u4e9b\u65f6\u5019\u6211\u4eec\u4f1a\u78b0\u5230\u9488\u5bf9\u4e0d\u540c\u5e73\u53f0\u7f16\u5199\u4e0d\u540c\u4ee3\u7801\u7684\u9700\u6c42\u3002","sidebar":"docs"},"platformcolor":{"id":"platformcolor","title":"PlatformColor","description":"You can use the PlatformColor function to access native colors on the target platform by supplying the native color\u2019s corresponding string value. You pass a string to the PlatformColor function and, provided it exists on that platform, it will return the corresponding native color, which you can apply in any part of your application.","sidebar":"api"},"pressable":{"id":"pressable","title":"Pressable","description":"Pressable \u662f\u4e00\u4e2a\u6838\u5fc3\u7ec4\u4ef6\u7684\u5c01\u88c5\uff0c\u5b83\u53ef\u4ee5\u68c0\u6d4b\u5230\u4efb\u610f\u5b50\u7ec4\u4ef6\u7684\u4e0d\u540c\u9636\u6bb5\u7684\u6309\u538b\u4ea4\u4e92\u60c5\u51b5\u3002","sidebar":"\u7ec4\u4ef6"},"pressevent":{"id":"pressevent","title":"\u70b9\u51fb\u4e8b\u4ef6\u5bf9\u8c61","description":"\u70b9\u51fb\u4e8b\u4ef6\u5bf9\u8c61\u4f5c\u4e3a\u7528\u6237\u6309\u538b\u4ea4\u4e92\u7684\u7ed3\u679c\u5728\u56de\u8c03\u4e2d\u8fd4\u56de\uff0c\u4f8b\u5982 Button \u7ec4\u4ef6\u4e2d\u7684 onPress\u3002","sidebar":"\u7ec4\u4ef6"},"profile-hermes":{"id":"profile-hermes","title":"\u5728 Hermes \u4e2d\u8fdb\u884c\u6027\u80fd\u5206\u6790","description":"\u4f60\u53ef\u4ee5\u4f7f\u7528Hermes\u5728 React Native \u5e94\u7528\u4e2d\u53ef\u89c6\u5316 JavaScript \u7684\u6027\u80fd\u3002Hermes \u662f\u4e00\u4e2a\u5c0f\u578b\u4e14\u8f7b\u91cf\u7684 JavaScript \u5f15\u64ce\uff08\u4f60\u53ef\u4ee5\u5728\u8fd9\u91cc\u9605\u8bfb\u66f4\u591a\u6709\u5173\u5728 React Native \u4e2d\u4f7f\u7528\u5b83\u7684\u4fe1\u606f\uff09\u3002Hermes \u6709\u52a9\u4e8e\u63d0\u9ad8\u5e94\u7528\u6027\u80fd\uff0c\u5e76\u4e14\u8fd8\u63d0\u4f9b\u4e86\u5206\u6790\u5176\u8fd0\u884c\u7684 JavaScript \u6027\u80fd\u7684\u65b9\u5f0f\u3002"},"profiling":{"id":"profiling","title":"Profiling","description":"\u4f7f\u7528\u5185\u7f6e\u7684\u6027\u80fd\u5206\u6790\u5668\u83b7\u53d6 JavaScript \u7ebf\u7a0b\u548c\u4e3b\u7ebf\u7a0b\u5e76\u6392\u7684\u8be6\u7ec6\u5de5\u4f5c\u4fe1\u606f\u3002\u4ece\u8c03\u8bd5\u83dc\u5355\u4e2d\u9009\u62e9 Perf Monitor \u5373\u53ef\u8bbf\u95ee\u5b83\u3002","sidebar":"docs"},"progressbarandroid":{"id":"progressbarandroid","title":"\ud83d\udea7 ProgressBarAndroid","description":"\u5df2\u8fc7\u65f6\u3002 Use @react-native-community/progress-bar-android instead."},"progressviewios":{"id":"progressviewios","title":"\ud83d\udea7 ProgressViewIOS","description":"\u5df2\u8fc7\u65f6\u3002 Use @react-native-community/progress-view instead."},"props":{"id":"props","title":"Props\uff08\u5c5e\u6027\uff09","description":"\u5927\u591a\u6570\u7ec4\u4ef6\u5728\u521b\u5efa\u65f6\u5c31\u53ef\u4ee5\u4f7f\u7528\u5404\u79cd\u53c2\u6570\u6765\u8fdb\u884c\u5b9a\u5236\u3002\u7528\u4e8e\u5b9a\u5236\u7684\u8fd9\u4e9b\u53c2\u6570\u5c31\u79f0\u4e3aprops\uff08\u5c5e\u6027\uff09\u3002"},"publishing-to-app-store":{"id":"publishing-to-app-store","title":"\u4e0a\u67b6 App Store","description":"\u4e0a\u67b6\u5e94\u7528\u7684\u8fc7\u7a0b\u548c\u4efb\u4f55\u5176\u5b83\u539f\u751f iOS \u5e94\u7528\u4e00\u6837\uff0c\u4f46\u6709\u4e00\u4e9b\u989d\u5916\u7684\u6ce8\u610f\u4e8b\u9879\u8981\u8003\u8651\u3002","sidebar":"docs"},"pushnotificationios":{"id":"pushnotificationios","title":"\ud83d\udea7 PushNotificationIOS","description":"\u5df2\u8fc7\u65f6\u3002 Use @react-native-community/push-notification-ios instead."},"ram-bundles-inline-requires":{"id":"ram-bundles-inline-requires","title":"RAM Bundles \u548c\u5185\u8054\u5f15\u7528\u4f18\u5316","description":"\u5982\u679c\u4f60\u6709\u4e00\u4e2a\u8f83\u4e3a\u5e9e\u5927\u7684\u5e94\u7528\u7a0b\u5e8f\uff0c\u4f60\u53ef\u80fd\u8981\u8003\u8651\u4f7f\u7528RAM(Random Access Modules\uff0c\u968f\u673a\u5b58\u53d6\u6a21\u5757\uff09\u683c\u5f0f\u7684 bundle \u548c\u5185\u8054\u5f15\u7528\u3002\u8fd9\u5bf9\u4e8e\u5177\u6709\u5927\u91cf\u9875\u9762\u7684\u5e94\u7528\u7a0b\u5e8f\u662f\u975e\u5e38\u6709\u7528\u7684\uff0c\u8fd9\u4e9b\u9875\u9762\u5728\u5e94\u7528\u7a0b\u5e8f\u7684\u5178\u578b\u4f7f\u7528\u8fc7\u7a0b\u4e2d\u53ef\u80fd\u4e0d\u4f1a\u88ab\u6253\u5f00\u3002\u901a\u5e38\u5bf9\u4e8e\u542f\u52a8\u540e\u4e00\u6bb5\u65f6\u95f4\u5185\u4e0d\u9700\u8981\u5927\u91cf\u4ee3\u7801\u7684\u5e94\u7528\u7a0b\u5e8f\u6765\u8bf4\u662f\u975e\u5e38\u6709\u7528\u7684\u3002\u4f8b\u5982\u5e94\u7528\u7a0b\u5e8f\u5305\u542b\u590d\u6742\u7684\u914d\u7f6e\u6587\u4ef6\u5c4f\u5e55\u6216\u8f83\u5c11\u4f7f\u7528\u7684\u529f\u80fd\uff0c\u4f46\u5927\u591a\u6570\u4f1a\u8bdd\u53ea\u6d89\u53ca\u8bbf\u95ee\u5e94\u7528\u7a0b\u5e8f\u7684\u4e3b\u5c4f\u5e55\u66f4\u65b0\u3002\u6211\u4eec\u53ef\u4ee5\u901a\u8fc7\u4f7f\u7528RAM\u683c\u5f0f\u6765\u4f18\u5316bundle\u7684\u52a0\u8f7d\uff0c\u5e76\u4e14\u5185\u8054\u5f15\u7528\u8fd9\u4e9b\u529f\u80fd\u548c\u9875\u9762\uff08\u5f53\u5b83\u4eec\u88ab\u5b9e\u9645\u4f7f\u7528\u65f6\uff09\u3002"},"react-18-and-react-native":{"id":"react-18-and-react-native","title":"React 18 \u4e0e React Native","description":"\u8fd9\u4e2a\u9875\u9762\u63cf\u8ff0\u4e86\u5982\u4f55\u5728 React Native \u7684\u65b0\u67b6\u6784\u4e2d\u542f\u7528 React 18 \u7248\u672c\u3002"},"react-native-devtools":{"id":"react-native-devtools","title":"React Native \u5f00\u53d1\u8005\u5de5\u5177","description":"React Native DevTools \u662f\u6211\u4eec\u65b0\u7684\u8c03\u8bd5\u4f53\u9a8c\uff0c\u5b83\u5bf9\u6211\u4eec\u7684\u8c03\u8bd5\u5806\u6808\u8fdb\u884c\u4e86\u7aef\u5230\u7aef\u7684\u91cd\u65b0\u7f16\u5199\u3002\u5b83\u65e8\u5728\u6bd4\u4ee5\u524d\u7684\u8c03\u8bd5\u65b9\u6cd5\u66f4\u6df1\u5165\u5730\u96c6\u6210\uff0c\u5e76\u4e14\u4ece\u6839\u672c\u4e0a\u66f4\u53ef\u9760\u3002","sidebar":"docs"},"react-native-gradle-plugin":{"id":"react-native-gradle-plugin","title":"React Native Gradle Plugin","description":"\u672c\u6307\u5357\u63cf\u8ff0\u4e86\u5982\u4f55\u914d\u7f6e React Native Gradle Plugin\uff08\u901a\u5e38\u79f0\u4e3a RNGP\uff09\u6765\u4e3a Android \u6784\u5efa React Native \u5e94\u7528\u3002","sidebar":"docs"},"react-node":{"id":"react-node","title":"React \u8282\u70b9\u5bf9\u8c61","description":"React \u8282\u70b9\u5bf9\u8c61\u6709\u4ee5\u4e0b\u8fd9\u4e9b\u7c7b\u578b\uff1a","sidebar":"\u7ec4\u4ef6"},"rect":{"id":"rect","title":"\u77e9\u5f62\u533a\u57df\u5bf9\u8c61","description":"Rect \u63a5\u53d7\u6570\u503c\u50cf\u7d20\u503c\u6765\u63cf\u8ff0\u5982\u4f55\u6269\u5c55\u77e9\u5f62\u533a\u57df\u3002\u8fd9\u4e9b\u503c\u4f1a\u88ab\u6dfb\u52a0\u5230\u539f\u59cb\u533a\u57df\u7684\u5927\u5c0f\u4e0a\u4ee5\u6269\u5c55\u5b83\u3002","sidebar":"\u7ec4\u4ef6"},"rectorsize":{"id":"rectorsize","title":"RectOrSize Object Type","description":"RectOrSize\u63a5\u53d7\u6570\u5b57\u50cf\u7d20\u503c\u6765\u63cf\u8ff0\u5982\u4f55\u6269\u5c55\u77e9\u5f62\u533a\u57df\u3002\u8fd9\u4e9b\u503c\u4f1a\u88ab\u6dfb\u52a0\u5230\u539f\u59cb\u533a\u57df\u7684\u5927\u5c0f\u4e0a\u4ee5\u6269\u5c55\u5b83\u3002"},"refreshcontrol":{"id":"refreshcontrol","title":"RefreshControl","description":"\u8fd9\u4e00\u7ec4\u4ef6\u53ef\u4ee5\u7528\u5728 ScrollView \u6216 FlatList \u5185\u90e8\uff0c\u4e3a\u5176\u6dfb\u52a0\u4e0b\u62c9\u5237\u65b0\u7684\u529f\u80fd\u3002\u5f53 ScrollView \u5904\u4e8e\u7ad6\u76f4\u65b9\u5411\u7684\u8d77\u70b9\u4f4d\u7f6e\uff08scrollY: 0\uff09\uff0c\u6b64\u65f6\u4e0b\u62c9\u4f1a\u89e6\u53d1\u4e00\u4e2aonRefresh\u4e8b\u4ef6\u3002","sidebar":"\u7ec4\u4ef6"},"removing-default-permissions":{"id":"removing-default-permissions","title":"\u79fb\u9664\u4e0d\u9700\u8981\u7684\u6743\u9650","description":"\u9ed8\u8ba4\u60c5\u51b5\u4e0b\u6211\u4eec\u4f1a\u7ed9\u6700\u7ec8\u6253\u5305\u7684 APK \u52a0\u5165\u4e00\u4e9b\u6743\u9650\u7533\u8bf7\uff0c\u5177\u4f53\u5982\u4e0b\uff1a"},"render-pipeline":{"id":"render-pipeline","title":"\u6e32\u67d3\uff0c\u63d0\u4ea4\u4e0e\u6302\u8f7d\uff08\u6e32\u67d3\u6d41\u6c34\u7ebf\uff09","description":"\u6587\u6863\u4ecb\u7ecd\u4e86\u5373\u5c06\u53d1\u5e03\u7684\u65b0\u6e32\u67d3\u5668 Fabric \u7684\u67b6\u6784\u3002"},"roottag":{"id":"roottag","title":"RootTag","description":"RootTag \u662f\u7528\u4e8e\u6807\u8bb0 React Native \u539f\u751f\u6839\u89c6\u56fe\u5c42\u7684\u4e0d\u900f\u660e\u6807\u8bc6\u7b26\uff08opaque identifier\uff09\u3002\u5177\u4f53\u6765\u8bf4\u5c31\u662f ReactRootView(android) \u6216\u662f RCTRootView(iOS) \u7684\u5b9e\u4f8b ID.","sidebar":"api"},"running-on-device":{"id":"running-on-device","title":"\u5728\u8bbe\u5907\u4e0a\u8fd0\u884c","description":"\u5728\u771f\u673a\u4e0a\u4ed4\u7ec6\u6d4b\u8bd5 app \u540e\u518d\u53d1\u5e03\u7ed9\u7528\u6237\u603b\u662f\u4e0d\u4f1a\u9519\u7684\u3002\u672c\u6587\u6863\u5c06\u6307\u5bfc\u4f60\u901a\u8fc7\u5fc5\u987b\u7684\u6b65\u9aa4\u5728\u8bbe\u5907\u4e0a\u8fd0\u884c React Native app\uff0c\u4e3a\u751f\u4ea7\u505a\u51c6\u5907\u3002","sidebar":"docs"},"running-on-simulator-ios":{"id":"running-on-simulator-ios","title":"\u5728iOS\u6a21\u62df\u5668\u4e0a\u8fd0\u884c","description":"\u542f\u52a8\u6a21\u62df\u5668","sidebar":"docs"},"safeareaview":{"id":"safeareaview","title":"SafeAreaView","description":"SafeAreaView\u7684\u76ee\u7684\u662f\u5728\u4e00\u4e2a\u201c\u5b89\u5168\u201d\u7684\u53ef\u89c6\u533a\u57df\u5185\u6e32\u67d3\u5185\u5bb9\u3002\u5177\u4f53\u6765\u8bf4\u5c31\u662f\u56e0\u4e3a\u76ee\u524d\u6709 iPhone X \u8fd9\u6837\u7684\u5e26\u6709\u201c\u5218\u6d77\u201d\u7684\u5168\u9762\u5c4f\u8bbe\u5907\uff0c\u6240\u4ee5\u9700\u8981\u907f\u514d\u5185\u5bb9\u6e32\u67d3\u5230\u4e0d\u53ef\u89c1\u7684\u201c\u5218\u6d77\u201d\u8303\u56f4\u5185\u3002\u672c\u7ec4\u4ef6\u76ee\u524d\u4ec5\u652f\u6301 iOS \u8bbe\u5907\u4ee5\u53ca iOS 11 \u6216\u66f4\u9ad8\u7248\u672c\u3002","sidebar":"\u7ec4\u4ef6"},"sample-application-movies":{"id":"sample-application-movies","title":"\u793a\u4f8b\u6559\u7a0b\uff1a\u7535\u5f71\u5217\u8868","description":"\u7b80\u4ecb"},"scrollview":{"id":"scrollview","title":"ScrollView","description":"\u4e00\u4e2a\u5c01\u88c5\u4e86\u5e73\u53f0\u7684 ScrollView\uff08\u6eda\u52a8\u89c6\u56fe\uff09\u7684\u7ec4\u4ef6\uff0c\u540c\u65f6\u8fd8\u96c6\u6210\u4e86\u89e6\u6478\u9501\u5b9a\u7684\u201c\u54cd\u5e94\u8005\u201d\u7cfb\u7edf\u3002","sidebar":"\u7ec4\u4ef6"},"sectionlist":{"id":"sectionlist","title":"SectionList","description":"\u9ad8\u6027\u80fd\u7684\u5206\u7ec4(section)\u5217\u8868\u7ec4\u4ef6\uff0c\u652f\u6301\u4e0b\u9762\u8fd9\u4e9b\u5e38\u7528\u7684\u529f\u80fd\uff1a","sidebar":"\u7ec4\u4ef6"},"security":{"id":"security","title":"\u7f51\u7edc\u5b89\u5168\u7b56\u7565","description":"\u5f00\u53d1\u5e94\u7528\u65f6\u5b89\u5168\u5e38\u5e38\u662f\u4e00\u4e2a\u88ab\u5ffd\u89c6\u7684\u8bdd\u9898\u3002\u7684\u786e\uff0c\u642d\u5efa\u4e00\u4e2a\u5b8c\u5168\u65e0\u61c8\u53ef\u51fb\u7684\u8f6f\u4ef6\u662f\u4e0d\u53ef\u80fd\u7684\u2014\u2014\u6211\u4eec\u8fd8\u6ca1\u6709\u53d1\u660e\u4e00\u4e2a\u5b8c\u5168\u575a\u4e0d\u53ef\u6467\u7684\u9501\uff08\u6bd5\u7adf\uff0c\u94f6\u884c\u91d1\u5e93\u5df2\u7ecf\u8db3\u591f\u575a\u56fa\u4f46\u4ecd\u7136\u4f1a\u88ab\u95ef\u5165\uff09\u3002\u7136\u800c\uff0c\u906d\u53d7\u6076\u610f\u653b\u51fb\u6216\u66b4\u9732\u5b89\u5168\u6f0f\u6d1e\u7684\u53ef\u80fd\u6027\u4e0e\u60a8\u613f\u610f\u6295\u5165\u4fdd\u62a4\u5e94\u7528\u7a0b\u5e8f\u514d\u53d7\u6b64\u7c7b\u4e8b\u4ef6\u7684\u52aa\u529b\u6210\u53cd\u6bd4\u3002\u5c3d\u7ba1\u666e\u901a\u7684\u6302\u9501\u53ef\u4ee5\u88ab\u64ac\u5f00\uff0c\u4f46\u5b83\u4ecd\u7136\u6bd4\u6a71\u67dc\u6302\u94a9\u66f4\u96be\u653b\u7834\uff01","sidebar":"docs"},"segmentedcontrolios":{"id":"segmentedcontrolios","title":"\ud83d\udea7 SegmentedControlIOS","description":"\u5df2\u8fc7\u65f6\u3002 Use @react-native-community/segmented-control instead."},"settings":{"id":"settings","title":"Settings","description":"Settings\u662f\u5bf9NSUserDefaults\u7684\u5c01\u88c5\u3002\u5b83\u662fiOS\u5e73\u53f0\u4e0a\u7684\u4e00\u79cd\u6301\u4e45\u7684\u952e\u503c\u5bf9\u5b58\u50a8\u3002","sidebar":"api"},"shadow-props":{"id":"shadow-props","title":"\u9634\u5f71\u6837\u5f0f\u5c5e\u6027","description":"These properties are iOS only - for similar functionality on Android, use the elevation property.","sidebar":"\u7ec4\u4ef6"},"share":{"id":"share","title":"Share","description":"\u793a\u4f8b","sidebar":"api"},"signed-apk-android":{"id":"signed-apk-android","title":"\u6253\u5305\u53d1\u5e03","description":"Android \u8981\u6c42\u6240\u6709\u5e94\u7528\u90fd\u6709\u4e00\u4e2a\u6570\u5b57\u7b7e\u540d\u624d\u4f1a\u88ab\u5141\u8bb8\u5b89\u88c5\u5728\u7528\u6237\u624b\u673a\u4e0a\uff0c\u6240\u4ee5\u5728\u628a\u5e94\u7528\u53d1\u5e03\u5230\u5e94\u7528\u5e02\u573a\u4e4b\u524d\uff0c\u4f60\u9700\u8981\u5148\u751f\u6210\u4e00\u4e2a\u7b7e\u540d\u7684 AAB \u6216 APK \u5305\uff08Google Play \u73b0\u5728\u8981\u6c42 AAB \u683c\u5f0f\uff0c\u800c\u56fd\u5185\u7684\u5e94\u7528\u5e02\u573a\u76ee\u524d\u4ec5\u652f\u6301 APK \u683c\u5f0f\u3002\u4f46\u65e0\u8bba\u54ea\u79cd\u683c\u5f0f\uff0c\u4e0b\u9762\u7684\u7b7e\u540d\u6b65\u9aa4\u662f\u4e00\u6837\u7684\uff09\u3002Android \u5f00\u53d1\u8005\u5b98\u7f51\u4e0a\u7684\u5982\u4f55\u7ed9\u4f60\u7684\u5e94\u7528\u7b7e\u540d\u6587\u6863\u63cf\u8ff0\u4e86\u7b7e\u540d\u7684\u7ec6\u8282\u3002\u672c\u6307\u5357\u65e8\u5728\u63d0\u4f9b\u4e00\u4e2a\u7b80\u5316\u7684\u7b7e\u540d\u548c\u6253\u5305\u7684\u64cd\u4f5c\u6b65\u9aa4\uff0c\u4e0d\u4f1a\u6d89\u53ca\u592a\u591a\u7406\u8bba\u3002","sidebar":"docs"},"slider":{"id":"slider","title":"\ud83d\udea7 Slider","description":"\u5df2\u8fc7\u65f6\u3002 Use @react-native-community/slider instead."},"speeding-ci-builds":{"id":"speeding-ci-builds","title":"\u4f18\u5316 CI \u6784\u5efa","description":"You or your company may have set up a Continuous Integration (CI) environment to test your React Native application."},"state":{"id":"state","title":"State\uff08\u72b6\u6001\uff09","description":"\u6211\u4eec\u4f7f\u7528\u4e24\u79cd\u6570\u636e\u6765\u63a7\u5236\u4e00\u4e2a\u7ec4\u4ef6\uff1aprops\u548cstate\u3002props\u662f\u5728\u7236\u7ec4\u4ef6\u4e2d\u6307\u5b9a\uff0c\u800c\u4e14\u4e00\u7ecf\u6307\u5b9a\uff0c\u5728\u88ab\u6307\u5b9a\u7684\u7ec4\u4ef6\u7684\u751f\u547d\u5468\u671f\u4e2d\u5219\u4e0d\u518d\u6539\u53d8\u3002\u5bf9\u4e8e\u9700\u8981\u6539\u53d8\u7684\u6570\u636e\uff0c\u6211\u4eec\u9700\u8981\u4f7f\u7528state\u3002"},"statusbar":{"id":"statusbar","title":"StatusBar","description":"\u63a7\u5236\u5e94\u7528\u72b6\u6001\u680f\u7684\u7ec4\u4ef6\u3002","sidebar":"\u7ec4\u4ef6"},"style":{"id":"style","title":"\u6837\u5f0f","description":"\u5728 React Native \u4e2d\uff0c\u4f60\u5e76\u4e0d\u9700\u8981\u5b66\u4e60\u4ec0\u4e48\u7279\u6b8a\u7684\u8bed\u6cd5\u6765\u5b9a\u4e49\u6837\u5f0f\u3002\u6211\u4eec\u4ecd\u7136\u662f\u4f7f\u7528 JavaScript \u6765\u5199\u6837\u5f0f\u3002\u6240\u6709\u7684\u6838\u5fc3\u7ec4\u4ef6\u90fd\u63a5\u53d7\u540d\u4e3astyle\u7684\u5c5e\u6027\u3002\u8fd9\u4e9b\u6837\u5f0f\u540d\u57fa\u672c\u4e0a\u662f\u9075\u5faa\u4e86 web \u4e0a\u7684 CSS \u7684\u547d\u540d\uff0c\u53ea\u662f\u6309\u7167 JS \u7684\u8bed\u6cd5\u8981\u6c42\u4f7f\u7528\u4e86\u9a7c\u5cf0\u547d\u540d\u6cd5\uff0c\u4f8b\u5982\u5c06background-color\u6539\u4e3abackgroundColor\u3002","sidebar":"docs"},"stylesheet":{"id":"stylesheet","title":"StyleSheet","description":"StyleSheet \u63d0\u4f9b\u4e86\u4e00\u79cd\u7c7b\u4f3c CSS \u6837\u5f0f\u8868\u7684\u62bd\u8c61\u3002","sidebar":"api"},"switch":{"id":"switch","title":"Switch","description":"\u8de8\u5e73\u53f0\u901a\u7528\u7684\u201c\u5f00\u5173\u201d\u7ec4\u4ef6\u3002","sidebar":"\u7ec4\u4ef6"},"symbolication":{"id":"symbolication","title":"Symbolicating a stack trace","description":"If a React Native app throws an unhandled exception in a release build, the output may be obfuscated and hard to read:"},"systrace":{"id":"systrace","title":"Systrace","description":"Systrace is a standard Android marker-based profiling tool (and is installed when you install the Android platform-tools package). Profiled code blocks are surrounded by start/end markers which are then visualized in a colorful chart format. Both the Android SDK and React Native framework provide standard markers that you can visualize.","sidebar":"api"},"testing-overview":{"id":"testing-overview","title":"Testing","description":"This guide introduces React Native developers to the key concepts behind testing, how to write good tests, and what kinds of tests you can incorporate into your workflow.","sidebar":"docs"},"text":{"id":"text","title":"Text","description":"\u4e00\u4e2a\u7528\u4e8e\u663e\u793a\u6587\u672c\u7684 React \u7ec4\u4ef6\uff0c\u5e76\u4e14\u5b83\u4e5f\u652f\u6301\u5d4c\u5957\u3001\u6837\u5f0f\uff0c\u4ee5\u53ca\u89e6\u6478\u5904\u7406\u3002","sidebar":"\u7ec4\u4ef6"},"text-style-props":{"id":"text-style-props","title":"Text \u6837\u5f0f\u5c5e\u6027","description":"\u793a\u4f8b","sidebar":"\u7ec4\u4ef6"},"textinput":{"id":"textinput","title":"TextInput","description":"TextInput \u662f\u4e00\u4e2a\u5141\u8bb8\u7528\u6237\u5728\u5e94\u7528\u4e2d\u901a\u8fc7\u952e\u76d8\u8f93\u5165\u6587\u672c\u7684\u57fa\u672c\u7ec4\u4ef6\u3002\u672c\u7ec4\u4ef6\u7684\u5c5e\u6027\u63d0\u4f9b\u4e86\u591a\u79cd\u7279\u6027\u7684\u914d\u7f6e\uff0c\u8b6c\u5982\u81ea\u52a8\u5b8c\u6210\u3001\u81ea\u52a8\u5927\u5c0f\u5199\u3001\u5360\u4f4d\u6587\u5b57\uff0c\u4ee5\u53ca\u591a\u79cd\u4e0d\u540c\u7684\u952e\u76d8\u7c7b\u578b\uff08\u5982\u7eaf\u6570\u5b57\u952e\u76d8\uff09\u7b49\u7b49\u3002","sidebar":"\u7ec4\u4ef6"},"the-new-architecture/backward-compatibility":{"id":"the-new-architecture/backward-compatibility","title":"\u5411\u540e\u517c\u5bb9\u7684\u610f\u4e49","description":"\u521b\u5efa\u4e00\u4e2a\u5411\u540e\u517c\u5bb9\u7684\u6a21\u5757\u5f88\u91cd\u8981\uff0c\u8fd9\u6837\u53ef\u4ee5\u5b9e\u73b0\u5728\u65e7\u67b6\u6784\u548c\u65b0\u67b6\u6784\u4e2d\u90fd\u80fd\u5de5\u4f5c\u7684\u5e93\u3002\u5e76\u4e0d\u662f\u6240\u6709\u7528\u6237\u90fd\u4f1a\u7acb\u523b\u8f6c\u5230\u65b0\u67b6\u6784\uff0c\u6700\u597d\u5728\u4ed6\u4eec\u4f7f\u7528\u65e7\u67b6\u6784\u65f6\u4ecd\u7136\u4fdd\u6301\u517c\u5bb9\u3002"},"the-new-architecture/backward-compatibility-fabric-components":{"id":"the-new-architecture/backward-compatibility-fabric-components","title":"\u4f7f Fabric \u7ec4\u4ef6\u4e0e\u4f20\u7edf\u539f\u751f\u7ec4\u4ef6\u517c\u5bb9","description":"\u521b\u5efa\u5411\u540e\u517c\u5bb9\u7684 Fabric \u539f\u751f\u7ec4\u4ef6\u9700\u8981\u4e86\u89e3\u5982\u4f55\u521b\u5efa\u4f20\u7edf\u7684\u539f\u751f\u7ec4\u4ef6\u3002\u8981\u56de\u5fc6\u8fd9\u4e9b\u6982\u5ff5\uff0c\u8bf7\u67e5\u770b\u6b64\u6307\u5357\u3002"},"the-new-architecture/backward-compatibility-turbomodules":{"id":"the-new-architecture/backward-compatibility-turbomodules","title":"\u4f7f Turbo \u6a21\u5757\u4e0e\u4f20\u7edf\u539f\u751f\u6a21\u5757\u517c\u5bb9","description":"\u521b\u5efa\u5411\u540e\u517c\u5bb9\u7684 Turbo \u539f\u751f\u6a21\u5757\u9700\u8981\u4e86\u89e3\u5982\u4f55\u521b\u5efa\u4f20\u7edf\u7684\u539f\u751f\u6a21\u5757\u3002\u8981\u56de\u5fc6\u8fd9\u4e9b\u6982\u5ff5\uff0c\u8bf7\u67e5\u770b\u6b64\u6307\u5357\u3002"},"the-new-architecture/codegen-cli":{"id":"the-new-architecture/codegen-cli","title":"Codegen \u547d\u4ee4\u884c\u5de5\u5177","description":"\u8c03\u7528 Gradle \u6216\u624b\u52a8\u8c03\u7528\u811a\u672c\u53ef\u80fd\u5f88\u96be\u8bb0\u4f4f\uff0c\u5e76\u4e14\u9700\u8981\u5f88\u591a\u6b65\u9aa4\u3002","sidebar":"docs"},"the-new-architecture/create-module-library":{"id":"the-new-architecture/create-module-library","title":"\u521b\u5efa\u6a21\u5757\u5e93","description":"React Native \u6709\u4e00\u4e2a\u4e30\u5bcc\u7684\u751f\u6001\u7cfb\u7edf\u5e93\u6765\u89e3\u51b3\u5e38\u89c1\u95ee\u9898\u3002\u6211\u4eec\u5728 reactnative.directory \u7f51\u7ad9\u4e0a\u6536\u96c6 React Native \u5e93\uff0c\u8fd9\u662f\u4e00\u4e2a\u5f88\u597d\u7684\u8d44\u6e90\uff0c\u503c\u5f97\u6bcf\u4e2a React Native \u5f00\u53d1\u8005\u6536\u85cf\u3002","sidebar":"docs"},"the-new-architecture/custom-cxx-types":{"id":"the-new-architecture/custom-cxx-types","title":"\u9ad8\u7ea7\uff1a\u81ea\u5b9a\u4e49 C++ \u7c7b\u578b","description":"\u672c\u6307\u5357\u5047\u8bbe\u4f60\u719f\u6089 \u7eaf C++ Turbo Native \u6a21\u5757 \u6307\u5357\u3002\u5b83\u5c06\u5728\u6b64\u57fa\u7840\u4e0a\u8fdb\u884c\u6784\u5efa\u3002","sidebar":"docs"},"the-new-architecture/cxx-custom-types":{"id":"the-new-architecture/cxx-custom-types","title":"\u652f\u6301\u81ea\u5b9a\u4e49 C++ \u7c7b\u578b","description":"\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0cC++ Turbo Native \u6a21\u5757\u652f\u6301\u5927\u591a\u6570 std:: \u6807\u51c6\u7c7b\u578b\u7684\u6865\u63a5\u529f\u80fd\u3002"},"the-new-architecture/cxx-cxxturbomodules":{"id":"the-new-architecture/cxx-cxxturbomodules","title":"C++ Turbo \u539f\u751f\u6a21\u5757","description":"\u672c\u6307\u5357\u5c06\u5411\u60a8\u5c55\u793a\u5982\u4f55\u4ec5\u4f7f\u7528 C++ \u5b9e\u73b0 Turbo \u539f\u751f\u6a21\u5757\uff0c\u4ee5\u4fbf\u4e0e\u4efb\u4f55\u652f\u6301\u7684\u5e73\u53f0\uff08Android\u3001iOS\u3001macOS \u6216 Windows\uff09\u5171\u4eab\u76f8\u540c\u7684\u5b9e\u73b0\u3002"},"the-new-architecture/landing-page":{"id":"the-new-architecture/landing-page","title":"\u65b0\u67b6\u6784\u4ecb\u7ecd","description":"\u4ece 0.68 \u7248\u672c\u5f00\u59cb\uff0cReact Native \u63d0\u4f9b\u4e86\u65b0\u67b6\u6784\uff0c\u5b83\u4e3a\u5f00\u53d1\u8005\u63d0\u4f9b\u4e86\u6784\u5efa\u9ad8\u6027\u80fd\u548c\u54cd\u5e94\u5f0f\u5e94\u7528\u7684\u65b0\u529f\u80fd\u3002\u8bf7\u8bbf\u95ee\\"\u4e3a\u4f55\u8981\u8bbe\u8ba1\u65b0\u67b6\u6784\\"\u6765\u4e86\u89e3\u66f4\u591a\u5173\u4e8e\u4fc3\u4f7f\u6211\u4eec\u51b3\u5b9a\u91cd\u65b0\u67b6\u6784\u7684\u539f\u56e0\uff0c\u4ee5\u53ca\u5b83\u63d0\u4f9b\u7684\u597d\u5904\u3002"},"the-new-architecture/pillars":{"id":"the-new-architecture/pillars","title":"\u65b0\u67b6\u6784\u7684\u4e24\u5927\u652f\u67f1","description":"\u65b0\u67b6\u6784\u4e3b\u8981\u7531\u4e24\u5927\u652f\u67f1\u7ec4\u6210\uff1a"},"the-new-architecture/pillars-codegen":{"id":"the-new-architecture/pillars-codegen","title":"Codegen","description":"Codegen \u4e0d\u7b97\u662f\u65b0\u67b6\u6784\u7684\u4e3b\u8981\u7ec4\u6210\u90e8\u5206\uff0c\u5b83\u662f\u4e00\u4e2a\u5e2e\u52a9\u6211\u4eec\u907f\u514d\u7f16\u5199\u91cd\u590d\u4ee3\u7801\u7684\u5de5\u5177\u3002Codegen \u5e76\u975e\u5fc5\u9009\u9879\uff0c\u60a8\u4ecd\u7136\u53ef\u4ee5\u624b\u5199\u5b83\u6240\u751f\u6210\u7684\u4ee3\u7801\uff0c\u4f46\u662f\u4f7f\u7528\u5b83\u6765\u751f\u6210\u811a\u624b\u67b6\u4ee3\u7801\u53ef\u4ee5\u5e2e\u60a8\u8282\u7701\u4e0d\u5c11\u65f6\u95f4\u3002"},"the-new-architecture/pillars-fabric-components":{"id":"the-new-architecture/pillars-fabric-components","title":"Fabric \u7ec4\u4ef6","description":"Fabric \u7ec4\u4ef6\u662f\u4e00\u79cd\u4f7f\u7528 Fabric \u6e32\u67d3\u5668\u6e32\u67d3\u5e76\u5c55\u793a\u5728\u5c4f\u5e55\u4e0a\u7684 UI \u7ec4\u4ef6\u3002\u5728\u65b0\u67b6\u6784\u4e2d\uff0c\u4f7f\u7528 Fabric \u7ec4\u4ef6\u66ff\u4ee3\u539f\u751f\u7ec4\u4ef6\u5177\u6709\u4ee5\u4e0b\u4f18\u52bf\uff1a"},"the-new-architecture/pillars-turbomodules":{"id":"the-new-architecture/pillars-turbomodules","title":"TurboModules","description":"\u5982\u679c\u60a8\u4f7f\u7528\u8fc7 React Native\uff0c\u60a8\u53ef\u80fd\u4e86\u89e3\u8fc7 Native Modules \u8fd9\u4e2a\u6982\u5ff5\u3002\u5b83\u53ef\u4ee5\u901a\u8fc7 React Native \u7684\u300cBridge\u300d\u5e2e\u52a9 JavaScript \u548c\u539f\u751f\u4ee3\u7801\u8fdb\u884c\u4ea4\u4e92\uff0c\u5e76\u4f7f\u7528\u8de8\u5e73\u53f0\u7684\u6570\u636e\u683c\u5f0f JSON \u8fdb\u884c\u901a\u8baf\u3002"},"the-new-architecture/pure-cxx-modules":{"id":"the-new-architecture/pure-cxx-modules","title":"\u7eaf C++ Turbo \u539f\u751f\u6a21\u5757","description":"\u7f16\u5199 C++ \u6a21\u5757\u662f\u8de8 Android \u548c iOS \u5171\u4eab\u5e73\u53f0\u65e0\u5173\u4ee3\u7801\u7684\u6700\u4f73\u65b9\u5f0f\u3002\u4f7f\u7528\u7eaf C++ \u6a21\u5757\uff0c\u60a8\u53ea\u9700\u7f16\u5199\u4e00\u6b21\u903b\u8f91\uff0c\u5373\u53ef\u5728\u6240\u6709\u5e73\u53f0\u4e0a\u91cd\u7528\u5b83\uff0c\u800c\u65e0\u9700\u7f16\u5199\u5e73\u53f0\u7279\u5b9a\u7684\u4ee3\u7801\u3002","sidebar":"docs"},"the-new-architecture/use-app-template":{"id":"the-new-architecture/use-app-template","title":"\u521b\u5efa\u542f\u7528\u65b0\u67b6\u6784\u7684\u5e94\u7528","description":"\u672c\u6587\u6863\u5c06\u5e2e\u52a9\u4f60\u4ece\u5934\u521b\u5efa\u4e00\u4e2a\u542f\u7528\u4e86\u65b0\u67b6\u6784\u7684 React Native \u5e94\u7528\u3002"},"the-new-architecture/using-codegen":{"id":"the-new-architecture/using-codegen","title":"\u4f7f\u7528 Codegen","description":"\u672c\u6307\u5357\u5c06\u6559\u4f60\u5982\u4f55\uff1a","sidebar":"docs"},"the-new-architecture/what-is-codegen":{"id":"the-new-architecture/what-is-codegen","title":"\u4ec0\u4e48\u662f Codegen\uff1f","description":"Codegen \u662f\u4e00\u4e2a\u907f\u514d\u7f16\u5199\u5927\u91cf\u91cd\u590d\u4ee3\u7801\u7684\u5de5\u5177\u3002\u4f7f\u7528 Codegen \u5e76\u4e0d\u662f\u5fc5\u987b\u7684\uff1a\u60a8\u53ef\u4ee5\u624b\u52a8\u7f16\u5199\u6240\u6709\u751f\u6210\u7684\u4ee3\u7801\u3002\u7136\u800c\uff0cCodegen \u751f\u6210\u7684\u811a\u624b\u67b6\u4ee3\u7801\u53ef\u4ee5\u8282\u7701\u60a8\u5f88\u591a\u65f6\u95f4\u3002","sidebar":"docs"},"the-new-architecture/why":{"id":"the-new-architecture/why","title":"\u4e3a\u4f55\u8981\u8bbe\u8ba1\u65b0\u67b6\u6784","description":"\u65b0\u67b6\u6784\u7684\u76ee\u6807\u662f\u89e3\u51b3\u56f0\u6270\u65e7\u67b6\u6784\u5728\u6027\u80fd\u548c\u7075\u6d3b\u6027\u65b9\u9762\u7684\u4e00\u4e9b\u95ee\u9898\u3002\u672c\u8282\u63d0\u4f9b\u4e86\u57fa\u672c\u7684\u80cc\u666f\uff0c\u4ee5\u4e86\u89e3\u65e7\u67b6\u6784\u7684\u5c40\u9650\u6027\uff0c\u4ee5\u53ca\u5982\u4f55\u901a\u8fc7\u65b0\u67b6\u6784\u6765\u514b\u670d\u8fd9\u4e9b\u5c40\u9650\u6027\u3002"},"threading-model":{"id":"threading-model","title":"\u7ebf\u7a0b\u6a21\u578b","description":"\u6587\u6863\u4ecb\u7ecd\u4e86\u5373\u5c06\u53d1\u5e03\u7684\u65b0\u6e32\u67d3\u5668 Fabric \u7684\u67b6\u6784\u3002"},"timepickerandroid":{"id":"timepickerandroid","title":"\ud83d\udea7 TimePickerAndroid","description":"\u5df2\u8fc7\u65f6\u3002 Use @react-native-community/datetimepicker instead."},"timers":{"id":"timers","title":"\u5b9a\u65f6\u5668","description":"\u5b9a\u65f6\u5668\u662f\u4e00\u4e2a\u5e94\u7528\u4e2d\u975e\u5e38\u91cd\u8981\u7684\u90e8\u5206\u3002React Native \u5b9e\u73b0\u4e86\u548c\u6d4f\u89c8\u5668\u4e00\u81f4\u7684\u5b9a\u65f6\u5668 Timer\u3002","sidebar":"docs"},"toastandroid":{"id":"toastandroid","title":"ToastAndroid","description":"\u672c\u6a21\u5757\u5c06\u539f\u751f\u7684 ToastAndroid \u6a21\u5757\u5bfc\u51fa\u4e3a\u4e00\u4e2a JS \u6a21\u5757\uff0c\u7528\u4e8e\u5728 Android \u8bbe\u5907\u4e0a\u663e\u793a\u4e00\u4e2a\u60ac\u6d6e\u7684\u63d0\u793a\u4fe1\u606f\u3002\u672c\u6a21\u5757\u5305\u542b\u4e00\u4e2ashow\u65b9\u6cd5\u63a5\u53d7\u4ee5\u4e0b\u7684\u53c2\u6570\uff1a","sidebar":"api"},"touchablehighlight":{"id":"touchablehighlight","title":"TouchableHighlight","description":"\u6211\u4eec\u5efa\u8bae\u4f7f\u7528Pressable\u7ec4\u4ef6\uff0c\u5b83\u66f4\u5177\u6269\u5c55\u6027\u4e14\u4f1a\u662f\u5b98\u65b9\u672a\u6765\u529b\u63a8\u7684\u4e3b\u6d41\u3002","sidebar":"\u7ec4\u4ef6"},"touchablenativefeedback":{"id":"touchablenativefeedback","title":"TouchableNativeFeedback","description":"If you\'re looking for a more extensive and future-proof way to handle touch-based input, check out the Pressable API.","sidebar":"\u7ec4\u4ef6"},"touchableopacity":{"id":"touchableopacity","title":"TouchableOpacity","description":"If you\'re looking for a more extensive and future-proof way to handle touch-based input, check out the Pressable API.","sidebar":"\u7ec4\u4ef6"},"touchablewithoutfeedback":{"id":"touchablewithoutfeedback","title":"TouchableWithoutFeedback","description":"If you\'re looking for a more extensive and future-proof way to handle touch-based input, check out the Pressable API.","sidebar":"\u7ec4\u4ef6"},"transforms":{"id":"transforms","title":"\u53d8\u6362\uff08Transform\uff09","description":"\u53d8\u6362\uff08Transform\uff09\u662f\u6837\u5f0f\u5c5e\u6027\uff0c\u53ef\u5e2e\u52a9\u60a8\u4f7f\u7528 2D \u6216 3D \u53d8\u6362\u4fee\u6539\u7ec4\u4ef6\u7684\u5916\u89c2\u548c\u4f4d\u7f6e\u3002\u7136\u800c\uff0c\u5373\u4fbf\u4f7f\u7528\u4e86\u53d8\u6362\uff0c\u4f7f\u7528\u53d8\u6362\u7684\u7ec4\u4ef6\u7684\u5e03\u5c40\u5e76\u4e0d\u4f1a\u53d8\u5316\uff0c\u56e0\u6b64\u53ef\u80fd\u4f1a\u4e0e\u9644\u8fd1\u7684\u7ec4\u4ef6\u91cd\u53e0\u3002\u60a8\u53ef\u4ee5\u5bf9\u53d8\u6362\u7684\u7ec4\u4ef6\u3001\u9644\u8fd1\u7684\u7ec4\u4ef6\u5e94\u7528\u8fb9\u8ddd\uff0c\u6216\u5bf9\u5bb9\u5668\u5e94\u7528\u586b\u5145\uff0c\u4ee5\u9632\u6b62\u8fd9\u79cd\u91cd\u53e0\u3002","sidebar":"api"},"troubleshooting":{"id":"troubleshooting","title":"Troubleshooting","description":"These are some common issues you may run into while setting up React Native. If you encounter something that is not listed here, try searching for the issue in GitHub."},"turbo-native-modules-android":{"id":"turbo-native-modules-android","title":"Turbo \u539f\u751f\u6a21\u5757\uff1aAndroid","description":"\u73b0\u5728\u6211\u4eec\u6765\u7f16\u5199\u4e00\u4e9b Android \u5e73\u53f0\u4ee3\u7801\uff0c\u4ee5\u786e\u4fdd localStorage \u5728\u5e94\u7528\u5173\u95ed\u540e\u4ecd\u7136\u53ef\u4ee5\u6301\u4e45\u4fdd\u5b58\u6570\u636e\u3002"},"turbo-native-modules-introduction":{"id":"turbo-native-modules-introduction","title":"Turbo \u539f\u751f\u6a21\u5757\u4ecb\u7ecd","description":"\u4f60\u7684 React Native \u5e94\u7528\u4ee3\u7801\u53ef\u80fd\u9700\u8981\u4e0e React Native \u6216\u73b0\u6709\u5e93\u672a\u63d0\u4f9b\u7684\u539f\u751f\u5e73\u53f0 API \u8fdb\u884c\u4ea4\u4e92\u3002\u4f60\u53ef\u4ee5\u4f7f\u7528 Turbo \u539f\u751f\u6a21\u5757 \u81ea\u5df1\u7f16\u5199\u96c6\u6210\u4ee3\u7801\u3002\u672c\u6307\u5357\u5c06\u5411\u4f60\u5c55\u793a\u5982\u4f55\u7f16\u5199\u4e00\u4e2a\u3002","sidebar":"docs"},"turbo-native-modules-ios":{"id":"turbo-native-modules-ios","title":"Turbo \u539f\u751f\u6a21\u5757\uff1aiOS","description":"\u73b0\u5728\u6211\u4eec\u6765\u7f16\u5199\u4e00\u4e9b iOS \u5e73\u53f0\u4ee3\u7801\uff0c\u4ee5\u786e\u4fdd localStorage \u5728\u5e94\u7528\u5173\u95ed\u540e\u4ecd\u7136\u53ef\u4ee5\u6301\u4e45\u4fdd\u5b58\u6570\u636e\u3002"},"tutorial":{"id":"tutorial","title":"\u793a\u4f8b\u6559\u7a0b\uff1aHello World","description":"React Native \u770b\u8d77\u6765\u5f88\u50cf React\uff0c\u53ea\u4e0d\u8fc7\u5176\u57fa\u7840\u7ec4\u4ef6\u662f\u539f\u751f\u7ec4\u4ef6\u800c\u975e web \u7ec4\u4ef6\u3002\u8981\u7406\u89e3 React Native \u5e94\u7528\u7684\u57fa\u672c\u7ed3\u6784\uff0c\u9996\u5148\u9700\u8981\u4e86\u89e3\u4e00\u4e9b\u57fa\u672c\u7684 React \u7684\u6982\u5ff5\uff0c\u6bd4\u5982 JSX \u8bed\u6cd5\u3001\u7ec4\u4ef6\u3001state\u72b6\u6001\u4ee5\u53caprops\u5c5e\u6027\u3002\u5982\u679c\u4f60\u5df2\u7ecf\u4e86\u89e3\u4e86 React\uff0c\u90a3\u4e48\u8fd8\u9700\u8981\u638c\u63e1\u4e00\u4e9b React Native \u7279\u6709\u7684\u77e5\u8bc6\uff0c\u6bd4\u5982\u539f\u751f\u7ec4\u4ef6\u7684\u4f7f\u7528\u3002\u8fd9\u7bc7\u6559\u7a0b\u53ef\u4ee5\u4f9b\u4efb\u4f55\u57fa\u7840\u7684\u8bfb\u8005\u5b66\u4e60\uff0c\u4e0d\u7ba1\u4f60\u662f\u5426\u6709 React \u65b9\u9762\u7684\u7ecf\u9a8c\u3002"},"typescript":{"id":"typescript","title":"\u4f7f\u7528 TypeScript","description":"TypeScript \u662f\u4e00\u79cd\u901a\u8fc7\u6dfb\u52a0\u7c7b\u578b\u5b9a\u4e49\u6765\u6269\u5c55 JavaScript \u7684\u8bed\u8a00\u3002\u65b0\u7684 React Native \u9879\u76ee\u9ed8\u8ba4\u4ee5 TypeScript \u4e3a\u76ee\u6807\uff0c\u540c\u65f6\u4e5f\u652f\u6301 JavaScript \u548c Flow\u3002","sidebar":"docs"},"upgrading":{"id":"upgrading","title":"\u66f4\u65b0","description":"\u65f6\u523b\u5c06 React Native \u66f4\u65b0\u5230\u6700\u65b0\u7684\u7248\u672c\uff0c\u53ef\u4ee5\u83b7\u5f97\u66f4\u591a API\u3001\u89c6\u56fe\u3001\u5f00\u53d1\u8005\u5de5\u5177\u4ee5\u53ca\u5176\u4ed6\u4e00\u4e9b\u597d\u4e1c\u897f\uff08\u8bd1\u6ce8\uff1a\u5b98\u65b9\u5f00\u53d1\u4efb\u52a1\u7e41\u91cd\uff0c\u4eba\u624b\u7d27\u7f3a\uff0c\u51e0\u4e4e\u4e0d\u4f1a\u5bf9\u65e7\u7248\u672c\u63d0\u4f9b\u7ef4\u62a4\u652f\u6301\uff0c\u6240\u4ee5\u5373\u4fbf\u66f4\u65b0\u53ef\u80fd\u5e26\u6765\u4e00\u4e9b\u517c\u5bb9\u4e0a\u7684\u53d8\u66f4\uff0c\u4f46\u5efa\u8bae\u5f00\u53d1\u8005\u8fd8\u662f\u5c3d\u4e00\u5207\u53ef\u80fd\u7b2c\u4e00\u65f6\u95f4\u66f4\u65b0\uff09\u3002\u7531\u4e8e\u4e00\u4e2a\u5b8c\u6574\u7684 React Native \u9879\u76ee\u662f\u7531 Android \u9879\u76ee\u3001iOS \u9879\u76ee\u548c JavaScript \u9879\u76ee\u7ec4\u6210\u7684\uff0c\u4e14\u90fd\u6253\u5305\u5728\u4e00\u4e2a npm \u5305\u4e2d\uff0c\u6240\u4ee5\u5347\u7ea7\u53ef\u80fd\u4f1a\u6709\u4e00\u4e9b\u9ebb\u70e6\u3002\u6211\u4eec\u4f1a\u5c3d\u91cf\u7b80\u5316\u8fd9\u4e00\u6d41\u7a0b\u3002\u4f60\u53ef\u4ee5\u5728\u9879\u76ee\u76ee\u5f55\u4e0b\u4f7f\u7528npx react-native info\u547d\u4ee4\u67e5\u770b\u5f53\u524d\u7684\u7248\u672c\u3002","sidebar":"docs"},"usecolorscheme":{"id":"usecolorscheme","title":"useColorScheme","description":"useColorScheme \u8fd9\u4e2aReact hook \u63d0\u4f9b\u5e76\u8ba2\u9605\u6765\u81eaAppearance\u6a21\u5757\u7684\u989c\u8272\u65b9\u6848\u66f4\u65b0\u3002\u8fd4\u56de\u503c\u8868\u793a\u5f53\u524d\u7528\u6237\u9996\u9009\u7684\u989c\u8272\u65b9\u6848\u3002\u8be5\u503c\u53ef\u4ee5\u7a0d\u540e\u901a\u8fc7\u76f4\u63a5\u7528\u6237\u52a8\u4f5c\uff08\u4f8b\u5982\uff0c\u8bbe\u5907\u8bbe\u7f6e\u4e2d\u7684\u4e3b\u9898\u9009\u62e9\uff09\u6216\u6839\u636e\u65f6\u95f4\u8868\uff08\u4f8b\u5982\uff0c\u9075\u5faa\u767d\u5929/\u591c\u665a\u5468\u671f\u7684\u4eae\u4e3b\u9898\u548c\u6697\u4e3b\u9898\uff09\u6765\u66f4\u65b0\u3002","sidebar":"api"},"usewindowdimensions":{"id":"usewindowdimensions","title":"useWindowDimensions","description":"useWindowDimensions\u4f1a\u5728\u5c4f\u5e55\u5c3a\u5bf8\u53d8\u5316\u65f6\u81ea\u52a8\u66f4\u65b0\u83b7\u53d6\u5230\u7684\u8bbe\u5907width\u548cheight\u503c\u3002\u4f7f\u7528\u65b9\u6cd5\u5982\u4e0b\uff1a","sidebar":"api"},"using-a-listview":{"id":"using-a-listview","title":"\u4f7f\u7528\u957f\u5217\u8868","description":"React Native \u63d0\u4f9b\u4e86\u51e0\u4e2a\u9002\u7528\u4e8e\u5c55\u793a\u957f\u5217\u8868\u6570\u636e\u7684\u7ec4\u4ef6\uff0c\u4e00\u822c\u800c\u8a00\u6211\u4eec\u4f1a\u9009\u7528FlatList\u6216\u662fSectionList\u3002","sidebar":"docs"},"using-a-scrollview":{"id":"using-a-scrollview","title":"\u4f7f\u7528\u6eda\u52a8\u89c6\u56fe","description":"ScrollView\u662f\u4e00\u4e2a\u901a\u7528\u7684\u53ef\u6eda\u52a8\u7684\u5bb9\u5668\uff0c\u4f60\u53ef\u4ee5\u5728\u5176\u4e2d\u653e\u5165\u591a\u4e2a\u7ec4\u4ef6\u548c\u89c6\u56fe\uff0c\u800c\u4e14\u8fd9\u4e9b\u7ec4\u4ef6\u5e76\u4e0d\u9700\u8981\u662f\u540c\u7c7b\u578b\u7684\u3002ScrollView \u4e0d\u4ec5\u53ef\u4ee5\u5782\u76f4\u6eda\u52a8\uff0c\u8fd8\u80fd\u6c34\u5e73\u6eda\u52a8\uff08\u901a\u8fc7horizontal\u5c5e\u6027\u6765\u8bbe\u7f6e\uff09\u3002","sidebar":"docs"},"vibration":{"id":"vibration","title":"Vibration","description":"\u4f7f\u8bbe\u5907\u632f\u52a8\u3002","sidebar":"api"},"view":{"id":"view","title":"View","description":"\u4f5c\u4e3a\u521b\u5efa UI \u65f6\u6700\u57fa\u7840\u7684\u7ec4\u4ef6\uff0cView \u662f\u4e00\u4e2a\u652f\u6301 Flexbox \u5e03\u5c40\u3001\u6837\u5f0f\u3001\u89e6\u6478\u54cd\u5e94\u3001\u548c\u4e00\u4e9b\u65e0\u969c\u788d\u529f\u80fd\u7684\u5bb9\u5668\u3002\u4e0d\u8bba\u5728\u4ec0\u4e48\u5e73\u53f0\u4e0a\uff0cView \u90fd\u76f4\u63a5\u5bf9\u5e94\u5f53\u524d\u5e73\u53f0\u7684\u539f\u751f\u89c6\u56fe\uff0c\u65e0\u8bba\u5b83\u662f UIView\u3001div \u8fd8\u662f android.view.View\u3002","sidebar":"\u7ec4\u4ef6"},"view-flattening":{"id":"view-flattening","title":"\u89c6\u56fe\u62cd\u5e73","description":"This document refers to the architecture of the new renderer, Fabric, that is in active roll-out."},"view-style-props":{"id":"view-style-props","title":"View \u6837\u5f0f\u5c5e\u6027","description":"\u793a\u4f8b","sidebar":"\u7ec4\u4ef6"},"viewpagerandroid":{"id":"viewpagerandroid","title":"\ud83d\udea7 ViewPagerAndroid","description":"\u5df2\u8fc7\u65f6\u3002 Use @react-native-community/viewpager instead."},"viewtoken":{"id":"viewtoken","title":"ViewToken \u5bf9\u8c61","description":"ViewToken object is returned as one of properties in the onViewableItemsChanged callback, for example in FlatList component. It is exported by ViewabilityHelper.js.","sidebar":"\u7ec4\u4ef6"},"virtualizedlist":{"id":"virtualizedlist","title":"VirtualizedList","description":"FlatList\u548cSectionList\u7684\u5e95\u5c42\u5b9e\u73b0\u3002FlatList \u548c SectionList \u4f7f\u7528\u8d77\u6765\u66f4\u65b9\u4fbf\uff0c\u540c\u65f6\u4e5f\u6709\u76f8\u5bf9\u66f4\u8be6\u7ec6\u7684\u6587\u6863\u3002\u4e00\u822c\u6765\u8bf4\uff0c\u4ec5\u5f53\u60f3\u83b7\u5f97\u6bd4 FlatList \u66f4\u9ad8\u7684\u7075\u6d3b\u6027\uff08\u6bd4\u5982\u8bf4\u5728\u4f7f\u7528 immutable data \u800c\u4e0d\u662f \u666e\u901a\u6570\u7ec4\uff09\u7684\u65f6\u5019\uff0c\u4f60\u624d\u5e94\u8be5\u8003\u8651\u4f7f\u7528 VirtualizedList\u3002","sidebar":"\u7ec4\u4ef6"},"xplat-implementation":{"id":"xplat-implementation","title":"\u8de8\u5e73\u53f0\u7684\u5b9e\u73b0","description":"This document refers to the architecture of the new renderer, Fabric, that is in active roll-out."}}}}')}}]); \ No newline at end of file diff --git a/assets/js/0058b4c6.6ffb0a21.js b/assets/js/0058b4c6.6ffb0a21.js deleted file mode 100644 index 6276f00400e..00000000000 --- a/assets/js/0058b4c6.6ffb0a21.js +++ /dev/null @@ -1,14 +0,0 @@ -"use strict"; -exports.id = 90849; -exports.ids = [90849]; -exports.modules = { - -/***/ 86164: -/***/ ((module) => { - -module.exports = /*#__PURE__*/JSON.parse('{"version":{"pluginId":"default","version":"0.76","label":"0.76","banner":null,"badge":false,"noIndex":false,"className":"docs-version-0.76","isLast":true,"docsSidebars":{"docs":[{"type":"category","label":"入门基础","items":[{"type":"link","label":"简介","href":"/docs/getting-started","docId":"getting-started","unlisted":false},{"type":"link","label":"核心组件与原生组件","href":"/docs/intro-react-native-components","docId":"intro-react-native-components","unlisted":false},{"type":"link","label":"React 基础","href":"/docs/intro-react","docId":"intro-react","unlisted":false},{"type":"link","label":"处理文本输入","href":"/docs/handling-text-input","docId":"handling-text-input","unlisted":false},{"type":"link","label":"使用滚动视图","href":"/docs/using-a-scrollview","docId":"using-a-scrollview","unlisted":false},{"type":"link","label":"使用长列表","href":"/docs/using-a-listview","docId":"using-a-listview","unlisted":false},{"type":"link","label":"特定平台代码","href":"/docs/platform-specific-code","docId":"platform-specific-code","unlisted":false},{"type":"link","label":"其他参考资源","href":"/docs/more-resources","docId":"more-resources","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"环境搭建","items":[{"type":"link","label":"搭建开发环境","href":"/docs/environment-setup","docId":"environment-setup","unlisted":false},{"type":"link","label":"集成到现有原生应用","href":"/docs/integration-with-existing-apps","docId":"integration-with-existing-apps","unlisted":false},{"type":"link","label":"集成到 Android Fragment","href":"/docs/integration-with-android-fragment","docId":"integration-with-android-fragment","unlisted":false},{"type":"link","label":"为电视和机顶盒制作应用","href":"/docs/building-for-tv","docId":"building-for-tv","unlisted":false},{"type":"link","label":"多平台支持","href":"/docs/out-of-tree-platforms","docId":"out-of-tree-platforms","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"开发流程","items":[{"type":"link","label":"在设备上运行","href":"/docs/running-on-device","docId":"running-on-device","unlisted":false},{"type":"link","label":"快速刷新","href":"/docs/fast-refresh","docId":"fast-refresh","unlisted":false},{"type":"link","label":"Metro","href":"/docs/metro","docId":"metro","unlisted":false},{"type":"link","label":"使用第三方库","href":"/docs/libraries","docId":"libraries","unlisted":false},{"type":"link","label":"使用 TypeScript","href":"/docs/typescript","docId":"typescript","unlisted":false},{"type":"link","label":"更新","href":"/docs/upgrading","docId":"upgrading","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"界面与交互","items":[{"type":"link","label":"样式","href":"/docs/style","docId":"style","unlisted":false},{"type":"link","label":"高度与宽度","href":"/docs/height-and-width","docId":"height-and-width","unlisted":false},{"type":"link","label":"使用 Flexbox 布局","href":"/docs/flexbox","docId":"flexbox","unlisted":false},{"type":"link","label":"图片","href":"/docs/images","docId":"images","unlisted":false},{"type":"link","label":"颜色","href":"/docs/colors","docId":"colors","unlisted":false},{"type":"category","label":"交互","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"处理触摸事件","href":"/docs/handling-touches","docId":"handling-touches","unlisted":false},{"type":"link","label":"使用导航器跳转页面","href":"/docs/navigation","docId":"navigation","unlisted":false},{"type":"link","label":"动画","href":"/docs/animations","docId":"animations","unlisted":false},{"type":"link","label":"手势响应系统","href":"/docs/gesture-responder-system","docId":"gesture-responder-system","unlisted":false}]},{"type":"category","label":"网络连接","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"访问网络","href":"/docs/network","docId":"network","unlisted":false},{"type":"link","label":"网络安全策略","href":"/docs/security","docId":"security","unlisted":false}]},{"type":"category","label":"包容性","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"无障碍功能","href":"/docs/accessibility","docId":"accessibility","unlisted":false}]}],"collapsed":true,"collapsible":true},{"type":"category","label":"调试","items":[{"type":"link","label":"调试","href":"/docs/debugging","docId":"debugging","unlisted":false},{"type":"link","label":"React Native 开发者工具","href":"/docs/react-native-devtools","docId":"react-native-devtools","unlisted":false},{"type":"link","label":"调试原生代码","href":"/docs/debugging-native-code","docId":"debugging-native-code","unlisted":false},{"type":"link","label":"调试发行版本","href":"/docs/debugging-release-builds","docId":"debugging-release-builds","unlisted":false},{"type":"link","label":"其他调试方法","href":"/docs/other-debugging-methods","docId":"other-debugging-methods","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"测试","items":[{"type":"link","label":"Testing","href":"/docs/testing-overview","docId":"testing-overview","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"性能调优","items":[{"type":"link","label":"性能综述","href":"/docs/performance","docId":"performance","unlisted":false},{"type":"link","label":"优化编译速度","href":"/docs/build-speed","docId":"build-speed","unlisted":false},{"type":"link","label":"列表配置优化","href":"/docs/optimizing-flatlist-configuration","docId":"optimizing-flatlist-configuration","unlisted":false},{"type":"link","label":"Optimizing JavaScript loading","href":"/docs/optimizing-javascript-loading","docId":"optimizing-javascript-loading","unlisted":false},{"type":"link","label":"Profiling","href":"/docs/profiling","docId":"profiling","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"JavaScript 运行环境","items":[{"type":"link","label":"JavaScript 环境","href":"/docs/javascript-environment","docId":"javascript-environment","unlisted":false},{"type":"link","label":"定时器","href":"/docs/timers","docId":"timers","unlisted":false},{"type":"link","label":"使用新的 Hermes 引擎","href":"/docs/hermes","docId":"hermes","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"Codegen","items":[{"type":"link","label":"什么是 Codegen?","href":"/docs/the-new-architecture/what-is-codegen","docId":"the-new-architecture/what-is-codegen","unlisted":false},{"type":"link","label":"使用 Codegen","href":"/docs/the-new-architecture/using-codegen","docId":"the-new-architecture/using-codegen","unlisted":false},{"type":"link","label":"Codegen 命令行工具","href":"/docs/the-new-architecture/codegen-cli","docId":"the-new-architecture/codegen-cli","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"原生开发","items":[{"type":"link","label":"桥接原生平台能力","href":"/docs/native-platform","docId":"native-platform","unlisted":false},{"type":"category","label":"原生模块","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"Turbo 原生模块介绍","href":"/docs/turbo-native-modules-introduction","docId":"turbo-native-modules-introduction","unlisted":false},{"type":"link","label":"纯 C++ Turbo 原生模块","href":"/docs/the-new-architecture/pure-cxx-modules","docId":"the-new-architecture/pure-cxx-modules","unlisted":false},{"type":"link","label":"高级:自定义 C++ 类型","href":"/docs/the-new-architecture/custom-cxx-types","docId":"the-new-architecture/custom-cxx-types","unlisted":false}]},{"type":"category","label":"原生 UI 组件","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"Fabric Native Components Introduction","href":"/docs/fabric-native-components-introduction","docId":"fabric-native-components-introduction","unlisted":false}]},{"type":"category","label":"其他","collapsible":true,"collapsed":true,"items":[{"type":"link","label":"appendix","href":"/docs/appendix","docId":"appendix","unlisted":false},{"type":"link","label":"创建模块库","href":"/docs/the-new-architecture/create-module-library","docId":"the-new-architecture/create-module-library","unlisted":false}]}],"collapsed":true,"collapsible":true},{"type":"category","label":"Android 与 iOS 指南","items":[{"type":"category","label":"Android","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"Headless JS(后台任务)","href":"/docs/headless-js-android","docId":"headless-js-android","unlisted":false},{"type":"link","label":"打包发布","href":"/docs/signed-apk-android","docId":"signed-apk-android","unlisted":false},{"type":"link","label":"和原生端通信","href":"/docs/communication-android","docId":"communication-android","unlisted":false},{"type":"link","label":"React Native Gradle Plugin","href":"/docs/react-native-gradle-plugin","docId":"react-native-gradle-plugin","unlisted":false}]},{"type":"category","label":"iOS","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"链接原生库","href":"/docs/linking-libraries-ios","docId":"linking-libraries-ios","unlisted":false},{"type":"link","label":"在iOS模拟器上运行","href":"/docs/running-on-simulator-ios","docId":"running-on-simulator-ios","unlisted":false},{"type":"link","label":"和原生端通信","href":"/docs/communication-ios","docId":"communication-ios","unlisted":false},{"type":"link","label":"iOS 应用小组件","href":"/docs/app-extensions","docId":"app-extensions","unlisted":false},{"type":"link","label":"上架 App Store","href":"/docs/publishing-to-app-store","docId":"publishing-to-app-store","unlisted":false}]}],"collapsed":true,"collapsible":true},{"type":"category","label":"旧架构","items":[{"type":"category","label":"原生模块(旧架构)","collapsible":true,"collapsed":true,"items":[{"type":"link","label":"原生模块简介","href":"/docs/legacy/native-modules-intro","docId":"legacy/native-modules-intro","unlisted":false},{"type":"link","label":"Android 原生模块","href":"/docs/legacy/native-modules-android","docId":"legacy/native-modules-android","unlisted":false},{"type":"link","label":"iOS 原生模块","href":"/docs/legacy/native-modules-ios","docId":"legacy/native-modules-ios","unlisted":false},{"type":"link","label":"Native Modules NPM Package Setup","href":"/docs/legacy/native-modules-setup","docId":"legacy/native-modules-setup","unlisted":false},{"type":"link","label":"Local libraries setup","href":"/docs/legacy/local-library-setup","docId":"legacy/local-library-setup","unlisted":false}]},{"type":"category","label":"原生 UI 组件(旧架构)","collapsible":true,"collapsed":true,"items":[{"type":"link","label":"Android 原生UI组件","href":"/docs/legacy/native-components-android","docId":"legacy/native-components-android","unlisted":false},{"type":"link","label":"iOS 原生UI组件","href":"/docs/legacy/native-components-ios","docId":"legacy/native-components-ios","unlisted":false},{"type":"link","label":"直接操作","href":"/docs/legacy/direct-manipulation","docId":"legacy/direct-manipulation","unlisted":false}]}],"collapsed":true,"collapsible":true}],"api":[{"type":"category","label":"APIs","items":[{"type":"link","label":"AccessibilityInfo","href":"/docs/accessibilityinfo","docId":"accessibilityinfo","unlisted":false},{"type":"link","label":"Alert","href":"/docs/alert","docId":"alert","unlisted":false},{"type":"link","label":"Animated","href":"/docs/animated","docId":"animated","unlisted":false},{"type":"link","label":"Animated.Value","href":"/docs/animatedvalue","docId":"animatedvalue","unlisted":false},{"type":"link","label":"Animated.ValueXY","href":"/docs/animatedvaluexy","docId":"animatedvaluexy","unlisted":false},{"type":"link","label":"Appearance","href":"/docs/appearance","docId":"appearance","unlisted":false},{"type":"link","label":"AppRegistry","href":"/docs/appregistry","docId":"appregistry","unlisted":false},{"type":"link","label":"AppState","href":"/docs/appstate","docId":"appstate","unlisted":false},{"type":"link","label":"DevSettings","href":"/docs/devsettings","docId":"devsettings","unlisted":false},{"type":"link","label":"Dimensions","href":"/docs/dimensions","docId":"dimensions","unlisted":false},{"type":"link","label":"Easing","href":"/docs/easing","docId":"easing","unlisted":false},{"type":"link","label":"InteractionManager","href":"/docs/interactionmanager","docId":"interactionmanager","unlisted":false},{"type":"link","label":"Keyboard","href":"/docs/keyboard","docId":"keyboard","unlisted":false},{"type":"link","label":"LayoutAnimation","href":"/docs/layoutanimation","docId":"layoutanimation","unlisted":false},{"type":"link","label":"Linking","href":"/docs/linking","docId":"linking","unlisted":false},{"type":"link","label":"PanResponder","href":"/docs/panresponder","docId":"panresponder","unlisted":false},{"type":"link","label":"PixelRatio","href":"/docs/pixelratio","docId":"pixelratio","unlisted":false},{"type":"link","label":"Platform","href":"/docs/platform","docId":"platform","unlisted":false},{"type":"link","label":"PlatformColor","href":"/docs/platformcolor","docId":"platformcolor","unlisted":false},{"type":"link","label":"RootTag","href":"/docs/roottag","docId":"roottag","unlisted":false},{"type":"link","label":"Share","href":"/docs/share","docId":"share","unlisted":false},{"type":"link","label":"StyleSheet","href":"/docs/stylesheet","docId":"stylesheet","unlisted":false},{"type":"link","label":"Systrace","href":"/docs/systrace","docId":"systrace","unlisted":false},{"type":"link","label":"变换(Transform)","href":"/docs/transforms","docId":"transforms","unlisted":false},{"type":"link","label":"Vibration","href":"/docs/vibration","docId":"vibration","unlisted":false},{"type":"category","label":"Hooks","collapsed":false,"items":[{"type":"link","label":"useColorScheme","href":"/docs/usecolorscheme","docId":"usecolorscheme","unlisted":false},{"type":"link","label":"useWindowDimensions","href":"/docs/usewindowdimensions","docId":"usewindowdimensions","unlisted":false}],"collapsible":true},{"type":"category","label":"Android API","collapsed":false,"items":[{"type":"link","label":"BackHandler","href":"/docs/backhandler","docId":"backhandler","unlisted":false},{"type":"link","label":"PermissionsAndroid","href":"/docs/permissionsandroid","docId":"permissionsandroid","unlisted":false},{"type":"link","label":"ToastAndroid","href":"/docs/toastandroid","docId":"toastandroid","unlisted":false}],"collapsible":true},{"type":"category","label":"iOS API","collapsed":false,"items":[{"type":"link","label":"ActionSheetIOS","href":"/docs/actionsheetios","docId":"actionsheetios","unlisted":false},{"type":"link","label":"DynamicColorIOS","href":"/docs/dynamiccolorios","docId":"dynamiccolorios","unlisted":false},{"type":"link","label":"Settings","href":"/docs/settings","docId":"settings","unlisted":false}],"collapsible":true}],"collapsed":true,"collapsible":true}],"组件":[{"type":"category","label":"核心组件","items":[{"type":"link","label":"核心组件和API","href":"/docs/components-and-apis","docId":"components-and-apis","unlisted":false},{"type":"link","label":"ActivityIndicator","href":"/docs/activityindicator","docId":"activityindicator","unlisted":false},{"type":"link","label":"Button","href":"/docs/button","docId":"button","unlisted":false},{"type":"link","label":"FlatList","href":"/docs/flatlist","docId":"flatlist","unlisted":false},{"type":"link","label":"Image","href":"/docs/image","docId":"image","unlisted":false},{"type":"link","label":"ImageBackground","href":"/docs/imagebackground","docId":"imagebackground","unlisted":false},{"type":"link","label":"KeyboardAvoidingView","href":"/docs/keyboardavoidingview","docId":"keyboardavoidingview","unlisted":false},{"type":"link","label":"Modal","href":"/docs/modal","docId":"modal","unlisted":false},{"type":"link","label":"Pressable","href":"/docs/pressable","docId":"pressable","unlisted":false},{"type":"link","label":"RefreshControl","href":"/docs/refreshcontrol","docId":"refreshcontrol","unlisted":false},{"type":"link","label":"ScrollView","href":"/docs/scrollview","docId":"scrollview","unlisted":false},{"type":"link","label":"SectionList","href":"/docs/sectionlist","docId":"sectionlist","unlisted":false},{"type":"link","label":"StatusBar","href":"/docs/statusbar","docId":"statusbar","unlisted":false},{"type":"link","label":"Switch","href":"/docs/switch","docId":"switch","unlisted":false},{"type":"link","label":"Text","href":"/docs/text","docId":"text","unlisted":false},{"type":"link","label":"TextInput","href":"/docs/textinput","docId":"textinput","unlisted":false},{"type":"link","label":"TouchableHighlight","href":"/docs/touchablehighlight","docId":"touchablehighlight","unlisted":false},{"type":"link","label":"TouchableOpacity","href":"/docs/touchableopacity","docId":"touchableopacity","unlisted":false},{"type":"link","label":"TouchableWithoutFeedback","href":"/docs/touchablewithoutfeedback","docId":"touchablewithoutfeedback","unlisted":false},{"type":"link","label":"View","href":"/docs/view","docId":"view","unlisted":false},{"type":"link","label":"VirtualizedList","href":"/docs/virtualizedlist","docId":"virtualizedlist","unlisted":false},{"type":"category","label":"Android 组件","collapsed":false,"items":[{"type":"link","label":"DrawerLayoutAndroid","href":"/docs/drawerlayoutandroid","docId":"drawerlayoutandroid","unlisted":false},{"type":"link","label":"TouchableNativeFeedback","href":"/docs/touchablenativefeedback","docId":"touchablenativefeedback","unlisted":false}],"collapsible":true},{"type":"category","label":"iOS 组件","collapsed":false,"items":[{"type":"link","label":"InputAccessoryView","href":"/docs/inputaccessoryview","docId":"inputaccessoryview","unlisted":false},{"type":"link","label":"SafeAreaView","href":"/docs/safeareaview","docId":"safeareaview","unlisted":false}],"collapsible":true}],"collapsed":true,"collapsible":true},{"type":"category","label":"Props","items":[{"type":"link","label":"图片样式属性","href":"/docs/image-style-props","docId":"image-style-props","unlisted":false},{"type":"link","label":"布局属性","href":"/docs/layout-props","docId":"layout-props","unlisted":false},{"type":"link","label":"阴影样式属性","href":"/docs/shadow-props","docId":"shadow-props","unlisted":false},{"type":"link","label":"Text 样式属性","href":"/docs/text-style-props","docId":"text-style-props","unlisted":false},{"type":"link","label":"View 样式属性","href":"/docs/view-style-props","docId":"view-style-props","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"内部对象类型","items":[{"type":"link","label":"布局事件对象","href":"/docs/layoutevent","docId":"layoutevent","unlisted":false},{"type":"link","label":"点击事件对象","href":"/docs/pressevent","docId":"pressevent","unlisted":false},{"type":"link","label":"React 节点对象","href":"/docs/react-node","docId":"react-node","unlisted":false},{"type":"link","label":"矩形区域对象","href":"/docs/rect","docId":"rect","unlisted":false},{"type":"link","label":"ViewToken 对象","href":"/docs/viewtoken","docId":"viewtoken","unlisted":false}],"collapsed":true,"collapsible":true}]},"docs":{"accessibility":{"id":"accessibility","title":"无障碍功能","description":"译注:accessibility 一词常见多种译法:可访问性、无障碍性、辅助功能等等,其中文意思都不太能准确表达其功能的本质——即为残障人士提供便利。本文主要采用“无障碍功能”和“辅助技术/服务”的说法。如果你或你的公司暂时没有资源和精力去服务这些用户,那么你可以跳过本文。但是,译者个人希望借本文档,呼吁有能力有资源的商业公司/组织/个人,重视残障人士使用智能手机的权利。","sidebar":"docs"},"accessibilityinfo":{"id":"accessibilityinfo","title":"AccessibilityInfo","description":"有时候我们希望知道用户的设备是否正在运行读屏应用。AccessibilityInfo正是用于此目的。你可以用它来查询读屏应用的当前状态,并且可以监听其状态变化。","sidebar":"api"},"actionsheetios":{"id":"actionsheetios","title":"ActionSheetIOS","description":"显示一个 iOS 原生的Action Sheet组件。","sidebar":"api"},"activityindicator":{"id":"activityindicator","title":"ActivityIndicator","description":"显示一个圆形的 loading 提示符号。","sidebar":"组件"},"alert":{"id":"alert","title":"Alert","description":"启动一个提示对话框,包含对应的标题和信息。","sidebar":"api"},"alertios":{"id":"alertios","title":"AlertIOS","description":"AlertIOS用于弹出一个 iOS 提示对话框,可以通知用户一些信息或是提示用户输入一些文字。"},"animated":{"id":"animated","title":"Animated","description":"Animated库旨在使动画变得流畅,强大并易于构建和维护。Animated侧重于输入和输出之间的声明性关系,以及两者之间的可配置变换,此外还提供了简单的 start/stop方法来控制基于时间的动画执行。","sidebar":"api"},"animatedvalue":{"id":"animatedvalue","title":"Animated.Value","description":"驱动动画的一维标量值. 一个Animated.Value可以同步地驱动多个属性,但每次只能以一种动画机制变化。如果改用了其他动画机制(例如开始一个新的动画或是调用setValue),则会停止先前的动画。","sidebar":"api"},"animatedvaluexy":{"id":"animatedvaluexy","title":"Animated.ValueXY","description":"2D 值用于驱动 2D 动画,例如平移手势。与普通的Animated.Value几乎相同的 API,但是可以多路复用。在内部包含两个常规的Animated.Value。","sidebar":"api"},"animations":{"id":"animations","title":"动画","description":"流畅、有意义的动画对于移动应用用户体验来说是非常重要的。现实生活中的物体在开始移动和停下来的时候都具有一定的惯性,我们在界面中也可以使用动画来实现契合物理规律的交互。","sidebar":"docs"},"app-extensions":{"id":"app-extensions","title":"iOS 应用小组件","description":"小组件允许您在主要应用程序之外提供自定义功能和内容。iOS上有不同类型的应用小组件,它们都在App Extension编程指南中进行了介绍。在本指南中,我们将简要介绍如何在iOS上利用应用小组件的优势。","sidebar":"docs"},"appearance":{"id":"appearance","title":"Appearance","description":"Appearance 模块提供了关于用户外观偏好的信息,例如他们喜欢的颜色方案(明亮或暗黑)。","sidebar":"api"},"appendix":{"id":"appendix","title":"appendix","description":"一、术语","sidebar":"docs"},"appregistry":{"id":"appregistry","title":"AppRegistry","description":"仅适用于非沙盒项目","sidebar":"api"},"appstate":{"id":"appstate","title":"AppState","description":"AppState能告诉你应用当前是在前台还是在后台,并且能在状态变化的时候通知你。","sidebar":"api"},"architecture-glossary":{"id":"architecture-glossary","title":"术语表","description":"Fabric 渲染器(Fabric Renderer)"},"architecture-overview":{"id":"architecture-overview","title":"架构概览","description":"本文档还在持续更新中,会从概念上介绍 React Native 新架构是如何工作的。目标读者包括生态库的开发者、核心贡献者和特别有好奇心的人。"},"asyncstorage":{"id":"asyncstorage","title":"🚧 AsyncStorage","description":"已过时。 Use one of the community packages instead."},"backhandler":{"id":"backhandler","title":"BackHandler","description":"BackHandler API 用于监听设备上的后退按钮事件,可以调用你自己的函数来处理后退行为。此 API 仅能在 Android 上使用。","sidebar":"api"},"build-speed":{"id":"build-speed","title":"优化编译速度","description":"构建 React Native 应用可能会非常昂贵,并且需要开发人员花费数分钟的时间。","sidebar":"docs"},"building-for-tv":{"id":"building-for-tv","title":"为电视和机顶盒制作应用","description":"目前的 React Native 应用只需在 JavaScript 端简单修改甚至无需修改,在电视和机顶盒设备上就基本可用了。","sidebar":"docs"},"button":{"id":"button","title":"Button","description":"一个简单的跨平台的按钮组件。可以进行一些简单的定制。","sidebar":"组件"},"checkbox":{"id":"checkbox","title":"🚧 CheckBox","description":"Removed. Use one of the community packages instead."},"clipboard":{"id":"clipboard","title":"🚧 Clipboard","description":"Deprecated. Use one of the community packages instead."},"colors":{"id":"colors","title":"颜色","description":"React Native 中的组件是使用 JavaScript 进行样式化的。颜色属性通常与 Web 上的 CSS 工作方式相匹配。每个平台上关于颜色使用的一般指南如下:","sidebar":"docs"},"communication-android":{"id":"communication-android","title":"和原生端通信","description":"通过植入原生应用和原生 UI 组件两篇文档,我们学习了 React Native 和原生组件的互相整合。在整合的过程中,我们会需要在两个世界间互相通信。有些方法已经在其他的指南中提到了,这篇文章总结了所有可行的技术。","sidebar":"docs"},"communication-ios":{"id":"communication-ios","title":"和原生端通信","description":"通过植入原生应用和原生 UI 组件两篇文档,我们学习了 React Native 和原生组件的互相整合。在整合的过程中,我们会需要在两个世界间互相通信。有些方法已经在其他的指南中提到了,这篇文章总结了所有可行的技术。","sidebar":"docs"},"components-and-apis":{"id":"components-and-apis","title":"核心组件和API","description":"React Native 提供了一些内置的核心组件供你使用。你可以在网站的左侧看到组件的完整列表。如果你不知道从哪看起,那么可以先看一下下面这个简单的分类:","sidebar":"组件"},"custom-webview-android":{"id":"custom-webview-android","title":"Custom WebView","description":"While the built-in web view has a lot of features, it is not possible to handle every use-case in React Native. You can, however, extend the web view with native code without forking React Native or duplicating all the existing web view code."},"custom-webview-ios":{"id":"custom-webview-ios","title":"Custom WebView","description":"While the built-in web view has a lot of features, it is not possible to handle every use-case in React Native. You can, however, extend the web view with native code without forking React Native or duplicating all the existing web view code."},"datepickerandroid":{"id":"datepickerandroid","title":"🚧 DatePickerAndroid","description":"Deprecated. Use one of the community packages instead."},"datepickerios":{"id":"datepickerios","title":"🚧 DatePickerIOS","description":"Deprecated. Use one of the community packages instead."},"debugging":{"id":"debugging","title":"调试","description":"访问 App 内的开发菜单","sidebar":"docs"},"debugging-native-code":{"id":"debugging-native-code","title":"调试原生代码","description":"Projects with Native Code Only","sidebar":"docs"},"debugging-release-builds":{"id":"debugging-release-builds","title":"调试发行版本","description":"符号化堆栈跟踪","sidebar":"docs"},"devsettings":{"id":"devsettings","title":"DevSettings","description":"DevSettings 模块可以对开发者菜单进行一些自定义。","sidebar":"api"},"dimensions":{"id":"dimensions","title":"Dimensions","description":"本模块用于获取设备屏幕的宽高。","sidebar":"api"},"drawerlayoutandroid":{"id":"drawerlayoutandroid","title":"DrawerLayoutAndroid","description":"封装了 Android 平台DrawerLayout的 React 组件。抽屉(通常用于导航切换)是通过renderNavigationView方法渲染的,并且 DrawerLayoutAndroid 的直接子视图会成为主视图(用于放置内容)。导航视图一开始在屏幕上并不可见,不过可以从drawerPosition指定的窗口侧面拖拽出来,并且抽屉的宽度可以使用drawerWidth属性来指定。","sidebar":"组件"},"dynamiccolorios":{"id":"dynamiccolorios","title":"DynamicColorIOS","description":"DynamicColorIOS函数是专门针对iOS平台的颜色类型。","sidebar":"api"},"easing":{"id":"easing","title":"Easing","description":"Easing模块实现了常见的动画缓动函数。 这个模块被Animated.timing()用于在动画中传达真实可信的运动。","sidebar":"api"},"environment-setup":{"id":"environment-setup","title":"搭建开发环境","description":"欢迎使用 React Native!这篇文档会帮助你搭建基本的 React Native 开发环境。","sidebar":"docs"},"fabric-native-components-android":{"id":"fabric-native-components-android","title":"Fabric Native Modules: Android","description":"现在,是时候编写一些 Android 平台代码,以便能够渲染 web 视图。以下是需要的步骤:"},"fabric-native-components-introduction":{"id":"fabric-native-components-introduction","title":"Fabric Native Components Introduction","description":"如果你想构建一个 新架构 的 React Native 组件,该组件可以包装一个 Host Component,例如 Android 上的 CheckBox,或者 iOS 上的 UIButton,你应该使用 Fabric 原生组件。","sidebar":"docs"},"fabric-native-components-ios":{"id":"fabric-native-components-ios","title":"Fabric Native Components: iOS","description":"现在,是时候编写一些 iOS 平台代码,以便能够渲染 web 视图。以下是需要的步骤:"},"fabric-renderer":{"id":"fabric-renderer","title":"Fabric 渲染器","description":"Fabric 是 React Native 新架构的渲染系统,是从老架构的渲染系统演变而来的。核心原理是在 C++ 层统一更多的渲染逻辑,提升与宿主平台(host platforms)互操作性,并为 React Native 解锁更多能力。其研发始于 2018 年。从 2021 年开始, Facebook App 中的 React Native 启用了新的渲染器。"},"fast-refresh":{"id":"fast-refresh","title":"快速刷新","description":"快速刷新是 React Native 一个特性,在修改组件的时候快速刷新会给你一个即时的反馈。快速刷新默认是开启的,可以通过调整 React Native 开发者菜单里面的 \\"Enable Fast Refresh\\" 来开启或关闭。在快速刷新开启的时候,大多数的修改能在一到两秒之内呈现。","sidebar":"docs"},"flatlist":{"id":"flatlist","title":"FlatList","description":"高性能的简单列表组件,支持下面这些常用的功能:","sidebar":"组件"},"flexbox":{"id":"flexbox","title":"使用 Flexbox 布局","description":"我们在 React Native 中使用 flexbox 规则来指定某个组件的子元素的布局。Flexbox 可以在不同屏幕尺寸上提供一致的布局结构。","sidebar":"docs"},"gesture-responder-system":{"id":"gesture-responder-system","title":"手势响应系统","description":"移动设备上的手势识别要比在 web 上复杂得多。用户的一次触摸操作的真实意图是什么,App 要经过好几个阶段才能判断。比如 App 需要判断用户的触摸到底是在滚动页面,还是滑动一个 widget,或者只是一个单纯的点击。甚至随着持续时间的不同,这些操作还会转化。此外,还有多点同时触控的情况。","sidebar":"docs"},"getting-started":{"id":"getting-started","title":"简介","description":"欢迎开启 React Native 的旅程!如果你在找如何搭建环境的文档,请移步搭建开发环境。 继续往下阅读可了解关于文档结构、原生组件、React等相关的一些介绍。","sidebar":"docs"},"handling-text-input":{"id":"handling-text-input","title":"处理文本输入","description":"TextInput是一个允许用户输入文本的基础组件。它有一个名为onChangeText的属性,此属性接受一个函数,而此函数会在文本变化时被调用。另外还有一个名为onSubmitEditing的属性,会在文本被提交后(用户按下软键盘上的提交键)调用。","sidebar":"docs"},"handling-touches":{"id":"handling-touches","title":"处理触摸事件","description":"移动应用上的用户交互基本靠“摸”。当然,“摸”也是有各种姿势的:在一个按钮上点击,在一个列表上滑动,或是在一个地图上缩放。React Native 提供了可以处理常见触摸手势(例如点击或滑动)的组件, 以及可用于识别更复杂的手势的完整的手势响应系统。","sidebar":"docs"},"headless-js-android":{"id":"headless-js-android","title":"Headless JS(后台任务)","description":"Headless JS 是一种使用 js 在后台执行任务的方法。它可以用来在后台同步数据、处理推送通知或是播放音乐等等。","sidebar":"docs"},"height-and-width":{"id":"height-and-width","title":"高度与宽度","description":"组件的高度和宽度决定了其在屏幕上显示的尺寸。","sidebar":"docs"},"hermes":{"id":"hermes","title":"使用新的 Hermes 引擎","description":"Hermes 是专门针对 React Native 应用而优化的全新开源 JavaScript 引擎。对于很多应用来说,启用 Hermes 引擎可以优化启动时间,减少内存占用以及空间占用。从 React Native 0.70 版本开始 Hermes 已经默认启用,无需开发者再做任何配置。","sidebar":"docs"},"image":{"id":"image","title":"Image","description":"用于显示多种不同类型图片的 React 组件,包括网络图片、静态资源、临时的本地图片、以及本地磁盘上的图片(如相册)等。","sidebar":"组件"},"image-style-props":{"id":"image-style-props","title":"图片样式属性","description":"示例","sidebar":"组件"},"imagebackground":{"id":"imagebackground","title":"ImageBackground","description":"对于熟悉 Web 开发的开发人员来说,background-image是一个常见的功能请求。为了处理这种情况,您可以使用`组件,它具有与`相同的属性,并且可以添加任何子元素以覆盖在其上面。","sidebar":"组件"},"imagepickerios":{"id":"imagepickerios","title":"🚧 ImagePickerIOS","description":"Deprecated. Use one of the community packages instead."},"images":{"id":"images","title":"图片","description":"静态图片资源","sidebar":"docs"},"improvingux":{"id":"improvingux","title":"改进用户体验","description":"配置文本输入"},"inputaccessoryview":{"id":"inputaccessoryview","title":"InputAccessoryView","description":"一个可以在iOS上自定义键盘输入辅助视图的组件。当TextInput获得焦点时,输入辅助视图显示在键盘上方。该组件可用于创建自定义工具栏。","sidebar":"组件"},"integration-with-android-fragment":{"id":"integration-with-android-fragment","title":"集成到 Android Fragment","description":"与现有应用程序集成指南中详细介绍了如何将全屏 React Native 应用程序作为 Activity 集成到现有 Android 应用程序中。要在现有应用程序的 Fragments 中使用 React Native 组件,需要进行一些额外的设置。这样做的好处是它允许原生应用程序将 React Native 组件与 Activity 中的原生 Fragments 集成在一起。","sidebar":"docs"},"integration-with-existing-apps":{"id":"integration-with-existing-apps","title":"集成到现有原生应用","description":"如果你正准备从头开始制作一个新的应用,那么 React Native 会是个非常好的选择。但如果你只想给现有的原生应用中添加一两个视图或是业务流程,React Native 也同样不在话下。只需简单几步,你就可以给原有应用加上新的基于 React Native 的特性、画面和视图等。","sidebar":"docs"},"interactionmanager":{"id":"interactionmanager","title":"InteractionManager","description":"Interactionmanager 可以将一些耗时较长的工作安排到所有互动或动画完成之后再进行。这样可以保证 JavaScript 动画的流畅运行。","sidebar":"api"},"intro-react":{"id":"intro-react","title":"React 基础","description":"要深入理解 React Native,需要扎实的React 基础知识。这篇小教程可以帮助你入门或者温习相关知识。","sidebar":"docs"},"intro-react-native-components":{"id":"intro-react-native-components","title":"核心组件与原生组件","description":"React Native 使用完全原生的组件来构建应用界面。尤其方便的是它已经内置了大量直接上手可用的核心组件。","sidebar":"docs"},"javascript-environment":{"id":"javascript-environment","title":"JavaScript 环境","description":"JavaScript 运行时环境","sidebar":"docs"},"keyboard":{"id":"keyboard","title":"Keyboard","description":"Keyboard模块用来控制键盘相关的事件。","sidebar":"api"},"keyboardavoidingview":{"id":"keyboardavoidingview","title":"KeyboardAvoidingView","description":"本组件用于解决一个常见的尴尬问题:手机上弹出的键盘常常会挡住当前的视图。本组件可以自动根据键盘的高度,调整自身的 height 或底部的 padding,以避免被遮挡。","sidebar":"组件"},"layout-props":{"id":"layout-props","title":"布局属性","description":"更多关于这些属性的详细示例可以在Flexbox 布局页面上找到。","sidebar":"组件"},"layoutanimation":{"id":"layoutanimation","title":"LayoutAnimation","description":"当布局变化时,自动将视图运动到它们新的位置上。","sidebar":"api"},"layoutevent":{"id":"layoutevent","title":"布局事件对象","description":"LayoutEvent object is returned in the callback as a result of component layout change, for example onLayout in View component.","sidebar":"组件"},"legacy/direct-manipulation":{"id":"legacy/direct-manipulation","title":"直接操作","description":"有时候我们需要直接改动组件并触发局部的刷新,但不使用 state 或是 props。譬如在浏览器中使用 React 库,有时候会需要直接修改一个 DOM 节点,而在手机 App 中操作 View 时也会碰到同样的情况。在 React Native 中,setNativeProps就是等价于直接操作 DOM 节点的方法。","sidebar":"docs"},"legacy/local-library-setup":{"id":"legacy/local-library-setup","title":"Local libraries setup","description":"A local library is a library containing views or modules that\'s local to your app and not published to a registry. This is different from the traditional setup for view and modules in the sense that a local library is decoupled from your app\'s native code.","sidebar":"docs"},"legacy/native-components-android":{"id":"legacy/native-components-android","title":"Android 原生UI组件","description":"在如今的 App 中,已经有成千上万的原生 UI 部件了——其中的一些是平台的一部分,另一些可能来自于一些第三方库,而且可能你自己还收藏了很多。React Native 已经封装了大部分最常见的组件,譬如ScrollView和TextInput,但不可能封装全部组件。而且,说不定你曾经为自己以前的 App 还封装过一些组件,React Native 肯定没法包含它们。幸运的是,在 React Naitve 应用程序中封装和植入已有的组件非常简单。","sidebar":"docs"},"legacy/native-components-ios":{"id":"legacy/native-components-ios","title":"iOS 原生UI组件","description":"在如今的 App 中,已经有成千上万的原生 UI 部件了——其中的一些是平台的一部分,另一些可能来自于一些第三方库,而且可能你自己还收藏了很多。React Native 已经封装了大部分最常见的组件,譬如ScrollView和TextInput,但不可能封装全部组件。而且,说不定你曾经为自己以前的 App 还封装过一些组件,React Native 肯定没法包含它们。幸运的是,在 React Naitve 应用程序中封装和植入已有的组件非常简单。","sidebar":"docs"},"legacy/native-modules-android":{"id":"legacy/native-modules-android","title":"Android 原生模块","description":"欢迎来到 Android 的原生模块。请先阅读 原生模块简介 以了解原生模块的基本概念。","sidebar":"docs"},"legacy/native-modules-intro":{"id":"legacy/native-modules-intro","title":"原生模块简介","description":"有时候 App 需要访问平台 API,但 React Native 可能还没有相应的模块包装;或者你需要复用一些 Java 代码,而不是用 Javascript 重新实现一遍;又或者你需要实现某些高性能的、多线程的代码,譬如图片处理、数据库、或者各种高级扩展等等。","sidebar":"docs"},"legacy/native-modules-ios":{"id":"legacy/native-modules-ios","title":"iOS 原生模块","description":"有时候 App 需要访问平台 API,但 React Native 可能还没有相应的模块封装;或者你需要复用 Objective-C、Swift 或 C++代码,而不是用 JavaScript 重新实现一遍;又或者你需要实现某些高性能、多线程的代码,譬如图片处理、数据库、或者各种高级扩展等等。","sidebar":"docs"},"legacy/native-modules-setup":{"id":"legacy/native-modules-setup","title":"Native Modules NPM Package Setup","description":"Native modules are usually distributed as npm packages, except that on top of the usual JavaScript they will include some native code per platform. To understand more about npm packages you may find this guide useful.","sidebar":"docs"},"libraries":{"id":"libraries","title":"使用第三方库","description":"This guide introduces React Native developers to finding, installing, and using third-party libraries in their apps.","sidebar":"docs"},"linking":{"id":"linking","title":"Linking","description":"Linking提供了一个通用的接口来与传入和传出的 App 链接进行交互。","sidebar":"api"},"linking-libraries-ios":{"id":"linking-libraries-ios","title":"链接原生库","description":"并不是所有的 APP 都需要使用全部的原生功能,包含支持全部特性的代码会增大应用的体积。但我们仍然希望能让你简单地根据自己的需求添加需要的特性。","sidebar":"docs"},"metro":{"id":"metro","title":"Metro","description":"React Native 使用Metro构建 JavaScript 代码和资源。","sidebar":"docs"},"modal":{"id":"modal","title":"Modal","description":"Modal 组件是一种简单的覆盖在其他视图之上显示内容的方式。","sidebar":"组件"},"more-resources":{"id":"more-resources","title":"其他参考资源","description":"如果你耐心的读完并理解了本网站上的所有文档,那么你应该已经可以编写一个像样的 React Native 应用了。但是 React Native 并不全是某一家公司的作品——它汇聚了成千上万开源社区开发者的智慧结晶。如果你想深入研究 React Native,那么建议不要错过下面这些参考资源。","sidebar":"docs"},"native-platform":{"id":"native-platform","title":"桥接原生平台能力","description":"你的应用可能需要访问 React Native 或社区维护的数百个 第三方库 中未直接提供的平台功能。也许你想要重用一些现有的 Objective-C、Swift、Java、Kotlin 或 C++ 代码。无论你的原因是什么,React Native 都提供了一组强大的 API 来连接你的原生代码和 JavaScript 应用代码。","sidebar":"docs"},"navigation":{"id":"navigation","title":"使用导航器跳转页面","description":"移动应用基本不会只由一个页面组成。管理多个页面的呈现、跳转的组件就是我们通常所说的导航器(navigator)。","sidebar":"docs"},"netinfo":{"id":"netinfo","title":"NetInfo","description":"已过时。 Use react-native-community/react-native-netinfo instead."},"network":{"id":"network","title":"访问网络","description":"很多移动应用都需要从远程地址中获取数据或资源。你可能需要给某个 REST API 发起 POST 请求以提交用户数据,又或者可能仅仅需要从某个服务器上获取一些静态内容——以下就是你会用到的东西。新手可以对照这个简短的视频教程加深理解。","sidebar":"docs"},"new-architecture-app-intro":{"id":"new-architecture-app-intro","title":"在应用中启用的预备工作","description":"在启用新架构之前,应先满足一些先决条件。"},"new-architecture-app-modules-ios":{"id":"new-architecture-app-modules-ios","title":"在 iOS 上启用 TurboModule","description":"Make sure your application meets all the prerequisites."},"new-architecture-app-renderer-android":{"id":"new-architecture-app-renderer-android","title":"在 Android 上启用 Fabric","description":"Make sure your application meets all the prerequisites."},"new-architecture-app-renderer-ios":{"id":"new-architecture-app-renderer-ios","title":"在 iOS 上启用 Fabric","description":"This section will go over how to enable the new renderer in your app. Make sure your application meets all the prerequisites."},"new-architecture-intro":{"id":"new-architecture-intro","title":"迁移到新架构","description":"此迁移指南旨在为React Native的库作者和应用程序开发者提供。它概述了您需要遵循的步骤,以在您的Android和iOS库和应用中使用由新的NativeModule系统(TurboModule)和新的渲染器(Fabric)组成的新架构。"},"new-architecture-library-android":{"id":"new-architecture-library-android","title":"在 Android 库中启用","description":"一旦您在先决条件中定义了本机模块的 JavaScript 规范,设置了 CodeGen 配置,并遵循了 Android/Gradle 设置,然后就可以将您的库迁移到新架构。以下是迁移所需的步骤。"},"new-architecture-library-intro":{"id":"new-architecture-library-intro","title":"在库中启用的预备工作","description":"The following steps will help ensure your modules and components are ready for the New Architecture."},"new-architecture-library-ios":{"id":"new-architecture-library-ios","title":"在 iOS 库中启用","description":"You have defined the JavaScript specs for your native modules as part of the prerequisites, and you are now ready to migrate your library to the New Architecture. Here are the steps you can follow to accomplish this."},"new-architecture-troubleshooting":{"id":"new-architecture-troubleshooting","title":"常见问题","description":"本页面会记录一些迁移到新架构时可能遇到的常见问题的解决方案。"},"new-architecture-turbo-modules":{"id":"new-architecture-turbo-modules","title":"新架构的原生模块(Turbo Module)","description":"If you\'ve worked with React Native, you may be familiar with the concept of Native Modules, which allow JavaScript and platform-native code to communicate over the React Native \\"bridge\\", which handles cross-platform serialization via JSON."},"optimizing-flatlist-configuration":{"id":"optimizing-flatlist-configuration","title":"列表配置优化","description":"术语定义","sidebar":"docs"},"optimizing-javascript-loading":{"id":"optimizing-javascript-loading","title":"Optimizing JavaScript loading","description":"解析和运行 JavaScript 代码需要内存和时间。因此,随着你的应用程序增长,通常将代码加载延迟到首次需要时是有用的。React Native 自带一些默认开启的标准优化,并且你可以在自己的代码中采用一些技术来帮助 React 更有效地加载你的应用程序。还有一些适合非常大应用程序的高级自动优化(它们也有自己的权衡)。","sidebar":"docs"},"other-debugging-methods":{"id":"other-debugging-methods","title":"其他调试方法","description":"此页面介绍了除 打开调试器 中描述的方法之外的其他 JavaScript 调试方法。如果你正在使用新创建的 React Native 或 Expo 应用,我们建议从那里开始。","sidebar":"docs"},"out-of-tree-platforms":{"id":"out-of-tree-platforms","title":"多平台支持","description":"React Native不仅适用于 Android 和 iOS - 还有社区支持的项目将其应用于其他平台,例如:","sidebar":"docs"},"panresponder":{"id":"panresponder","title":"PanResponder","description":"PanResponder类可以将多点触摸操作协调成一个手势。它使得一个单点触摸可以接受更多的触摸操作,也可以用于识别简单的多点触摸手势。","sidebar":"api"},"performance":{"id":"performance","title":"性能综述","description":"使用 React Native 替代基于 WebView 的框架来开发 App 的一个强有力的理由,就是为了使 App 可以达到每秒 60 帧(足够流畅),并且能有类似原生 App 的外观和手感。因此我们也尽可能地优化 React Native 去实现这一目标,使开发者能集中精力处理 App 的业务逻辑,而不用费心考虑性能。但是,总还是有一些地方有所欠缺,以及在某些场合 React Native 还不能够替你决定如何进行优化(用原生代码写也无法避免),因此人工的干预依然是必要的。","sidebar":"docs"},"permissionsandroid":{"id":"permissionsandroid","title":"PermissionsAndroid","description":"仅适用于非沙盒项目","sidebar":"api"},"pixelratio":{"id":"pixelratio","title":"PixelRatio","description":"PixelRatio 可以获取到设备的像素密度和字体缩放比。","sidebar":"api"},"platform":{"id":"platform","title":"Platform","description":"Example","sidebar":"api"},"platform-specific-code":{"id":"platform-specific-code","title":"特定平台代码","description":"在编写跨平台的应用时,我们肯定希望尽可能多地复用代码。但是总有些时候我们会碰到针对不同平台编写不同代码的需求。","sidebar":"docs"},"platformcolor":{"id":"platformcolor","title":"PlatformColor","description":"You can use the PlatformColor function to access native colors on the target platform by supplying the native color’s corresponding string value. You pass a string to the PlatformColor function and, provided it exists on that platform, it will return the corresponding native color, which you can apply in any part of your application.","sidebar":"api"},"pressable":{"id":"pressable","title":"Pressable","description":"Pressable 是一个核心组件的封装,它可以检测到任意子组件的不同阶段的按压交互情况。","sidebar":"组件"},"pressevent":{"id":"pressevent","title":"点击事件对象","description":"点击事件对象作为用户按压交互的结果在回调中返回,例如 Button 组件中的 onPress。","sidebar":"组件"},"profile-hermes":{"id":"profile-hermes","title":"在 Hermes 中进行性能分析","description":"你可以使用Hermes在 React Native 应用中可视化 JavaScript 的性能。Hermes 是一个小型且轻量的 JavaScript 引擎(你可以在这里阅读更多有关在 React Native 中使用它的信息)。Hermes 有助于提高应用性能,并且还提供了分析其运行的 JavaScript 性能的方式。"},"profiling":{"id":"profiling","title":"Profiling","description":"使用内置的性能分析器获取 JavaScript 线程和主线程并排的详细工作信息。从调试菜单中选择 Perf Monitor 即可访问它。","sidebar":"docs"},"progressbarandroid":{"id":"progressbarandroid","title":"🚧 ProgressBarAndroid","description":"已过时。 Use @react-native-community/progress-bar-android instead."},"progressviewios":{"id":"progressviewios","title":"🚧 ProgressViewIOS","description":"已过时。 Use @react-native-community/progress-view instead."},"props":{"id":"props","title":"Props(属性)","description":"大多数组件在创建时就可以使用各种参数来进行定制。用于定制的这些参数就称为props(属性)。"},"publishing-to-app-store":{"id":"publishing-to-app-store","title":"上架 App Store","description":"上架应用的过程和任何其它原生 iOS 应用一样,但有一些额外的注意事项要考虑。","sidebar":"docs"},"pushnotificationios":{"id":"pushnotificationios","title":"🚧 PushNotificationIOS","description":"已过时。 Use @react-native-community/push-notification-ios instead."},"ram-bundles-inline-requires":{"id":"ram-bundles-inline-requires","title":"RAM Bundles 和内联引用优化","description":"如果你有一个较为庞大的应用程序,你可能要考虑使用RAM(Random Access Modules,随机存取模块)格式的 bundle 和内联引用。这对于具有大量页面的应用程序是非常有用的,这些页面在应用程序的典型使用过程中可能不会被打开。通常对于启动后一段时间内不需要大量代码的应用程序来说是非常有用的。例如应用程序包含复杂的配置文件屏幕或较少使用的功能,但大多数会话只涉及访问应用程序的主屏幕更新。我们可以通过使用RAM格式来优化bundle的加载,并且内联引用这些功能和页面(当它们被实际使用时)。"},"react-18-and-react-native":{"id":"react-18-and-react-native","title":"React 18 与 React Native","description":"这个页面描述了如何在 React Native 的新架构中启用 React 18 版本。"},"react-native-devtools":{"id":"react-native-devtools","title":"React Native 开发者工具","description":"React Native DevTools 是我们新的调试体验,它对我们的调试堆栈进行了端到端的重新编写。它旨在比以前的调试方法更深入地集成,并且从根本上更可靠。","sidebar":"docs"},"react-native-gradle-plugin":{"id":"react-native-gradle-plugin","title":"React Native Gradle Plugin","description":"本指南描述了如何配置 React Native Gradle Plugin(通常称为 RNGP)来为 Android 构建 React Native 应用。","sidebar":"docs"},"react-node":{"id":"react-node","title":"React 节点对象","description":"React 节点对象有以下这些类型:","sidebar":"组件"},"rect":{"id":"rect","title":"矩形区域对象","description":"Rect 接受数值像素值来描述如何扩展矩形区域。这些值会被添加到原始区域的大小上以扩展它。","sidebar":"组件"},"rectorsize":{"id":"rectorsize","title":"RectOrSize Object Type","description":"RectOrSize接受数字像素值来描述如何扩展矩形区域。这些值会被添加到原始区域的大小上以扩展它。"},"refreshcontrol":{"id":"refreshcontrol","title":"RefreshControl","description":"这一组件可以用在 ScrollView 或 FlatList 内部,为其添加下拉刷新的功能。当 ScrollView 处于竖直方向的起点位置(scrollY: 0),此时下拉会触发一个onRefresh事件。","sidebar":"组件"},"removing-default-permissions":{"id":"removing-default-permissions","title":"移除不需要的权限","description":"默认情况下我们会给最终打包的 APK 加入一些权限申请,具体如下:"},"render-pipeline":{"id":"render-pipeline","title":"渲染,提交与挂载(渲染流水线)","description":"文档介绍了即将发布的新渲染器 Fabric 的架构。"},"roottag":{"id":"roottag","title":"RootTag","description":"RootTag 是用于标记 React Native 原生根视图层的不透明标识符(opaque identifier)。具体来说就是 ReactRootView(android) 或是 RCTRootView(iOS) 的实例 ID.","sidebar":"api"},"running-on-device":{"id":"running-on-device","title":"在设备上运行","description":"在真机上仔细测试 app 后再发布给用户总是不会错的。本文档将指导你通过必须的步骤在设备上运行 React Native app,为生产做准备。","sidebar":"docs"},"running-on-simulator-ios":{"id":"running-on-simulator-ios","title":"在iOS模拟器上运行","description":"启动模拟器","sidebar":"docs"},"safeareaview":{"id":"safeareaview","title":"SafeAreaView","description":"SafeAreaView的目的是在一个“安全”的可视区域内渲染内容。具体来说就是因为目前有 iPhone X 这样的带有“刘海”的全面屏设备,所以需要避免内容渲染到不可见的“刘海”范围内。本组件目前仅支持 iOS 设备以及 iOS 11 或更高版本。","sidebar":"组件"},"sample-application-movies":{"id":"sample-application-movies","title":"示例教程:电影列表","description":"简介"},"scrollview":{"id":"scrollview","title":"ScrollView","description":"一个封装了平台的 ScrollView(滚动视图)的组件,同时还集成了触摸锁定的“响应者”系统。","sidebar":"组件"},"sectionlist":{"id":"sectionlist","title":"SectionList","description":"高性能的分组(section)列表组件,支持下面这些常用的功能:","sidebar":"组件"},"security":{"id":"security","title":"网络安全策略","description":"开发应用时安全常常是一个被忽视的话题。的确,搭建一个完全无懈可击的软件是不可能的——我们还没有发明一个完全坚不可摧的锁(毕竟,银行金库已经足够坚固但仍然会被闯入)。然而,遭受恶意攻击或暴露安全漏洞的可能性与您愿意投入保护应用程序免受此类事件的努力成反比。尽管普通的挂锁可以被撬开,但它仍然比橱柜挂钩更难攻破!","sidebar":"docs"},"segmentedcontrolios":{"id":"segmentedcontrolios","title":"🚧 SegmentedControlIOS","description":"已过时。 Use @react-native-community/segmented-control instead."},"settings":{"id":"settings","title":"Settings","description":"Settings是对NSUserDefaults的封装。它是iOS平台上的一种持久的键值对存储。","sidebar":"api"},"shadow-props":{"id":"shadow-props","title":"阴影样式属性","description":"These properties are iOS only - for similar functionality on Android, use the elevation property.","sidebar":"组件"},"share":{"id":"share","title":"Share","description":"示例","sidebar":"api"},"signed-apk-android":{"id":"signed-apk-android","title":"打包发布","description":"Android 要求所有应用都有一个数字签名才会被允许安装在用户手机上,所以在把应用发布到应用市场之前,你需要先生成一个签名的 AAB 或 APK 包(Google Play 现在要求 AAB 格式,而国内的应用市场目前仅支持 APK 格式。但无论哪种格式,下面的签名步骤是一样的)。Android 开发者官网上的如何给你的应用签名文档描述了签名的细节。本指南旨在提供一个简化的签名和打包的操作步骤,不会涉及太多理论。","sidebar":"docs"},"slider":{"id":"slider","title":"🚧 Slider","description":"已过时。 Use @react-native-community/slider instead."},"speeding-ci-builds":{"id":"speeding-ci-builds","title":"优化 CI 构建","description":"You or your company may have set up a Continuous Integration (CI) environment to test your React Native application."},"state":{"id":"state","title":"State(状态)","description":"我们使用两种数据来控制一个组件:props和state。props是在父组件中指定,而且一经指定,在被指定的组件的生命周期中则不再改变。对于需要改变的数据,我们需要使用state。"},"statusbar":{"id":"statusbar","title":"StatusBar","description":"控制应用状态栏的组件。","sidebar":"组件"},"style":{"id":"style","title":"样式","description":"在 React Native 中,你并不需要学习什么特殊的语法来定义样式。我们仍然是使用 JavaScript 来写样式。所有的核心组件都接受名为style的属性。这些样式名基本上是遵循了 web 上的 CSS 的命名,只是按照 JS 的语法要求使用了驼峰命名法,例如将background-color改为backgroundColor。","sidebar":"docs"},"stylesheet":{"id":"stylesheet","title":"StyleSheet","description":"StyleSheet 提供了一种类似 CSS 样式表的抽象。","sidebar":"api"},"switch":{"id":"switch","title":"Switch","description":"跨平台通用的“开关”组件。","sidebar":"组件"},"symbolication":{"id":"symbolication","title":"Symbolicating a stack trace","description":"If a React Native app throws an unhandled exception in a release build, the output may be obfuscated and hard to read:"},"systrace":{"id":"systrace","title":"Systrace","description":"Systrace is a standard Android marker-based profiling tool (and is installed when you install the Android platform-tools package). Profiled code blocks are surrounded by start/end markers which are then visualized in a colorful chart format. Both the Android SDK and React Native framework provide standard markers that you can visualize.","sidebar":"api"},"testing-overview":{"id":"testing-overview","title":"Testing","description":"This guide introduces React Native developers to the key concepts behind testing, how to write good tests, and what kinds of tests you can incorporate into your workflow.","sidebar":"docs"},"text":{"id":"text","title":"Text","description":"一个用于显示文本的 React 组件,并且它也支持嵌套、样式,以及触摸处理。","sidebar":"组件"},"text-style-props":{"id":"text-style-props","title":"Text 样式属性","description":"示例","sidebar":"组件"},"textinput":{"id":"textinput","title":"TextInput","description":"TextInput 是一个允许用户在应用中通过键盘输入文本的基本组件。本组件的属性提供了多种特性的配置,譬如自动完成、自动大小写、占位文字,以及多种不同的键盘类型(如纯数字键盘)等等。","sidebar":"组件"},"the-new-architecture/backward-compatibility":{"id":"the-new-architecture/backward-compatibility","title":"向后兼容的意义","description":"创建一个向后兼容的模块很重要,这样可以实现在旧架构和新架构中都能工作的库。并不是所有用户都会立刻转到新架构,最好在他们使用旧架构时仍然保持兼容。"},"the-new-architecture/backward-compatibility-fabric-components":{"id":"the-new-architecture/backward-compatibility-fabric-components","title":"使 Fabric 组件与传统原生组件兼容","description":"创建向后兼容的 Fabric 原生组件需要了解如何创建传统的原生组件。要回忆这些概念,请查看此指南。"},"the-new-architecture/backward-compatibility-turbomodules":{"id":"the-new-architecture/backward-compatibility-turbomodules","title":"使 Turbo 模块与传统原生模块兼容","description":"创建向后兼容的 Turbo 原生模块需要了解如何创建传统的原生模块。要回忆这些概念,请查看此指南。"},"the-new-architecture/codegen-cli":{"id":"the-new-architecture/codegen-cli","title":"Codegen 命令行工具","description":"调用 Gradle 或手动调用脚本可能很难记住,并且需要很多步骤。","sidebar":"docs"},"the-new-architecture/create-module-library":{"id":"the-new-architecture/create-module-library","title":"创建模块库","description":"React Native 有一个丰富的生态系统库来解决常见问题。我们在 reactnative.directory 网站上收集 React Native 库,这是一个很好的资源,值得每个 React Native 开发者收藏。","sidebar":"docs"},"the-new-architecture/custom-cxx-types":{"id":"the-new-architecture/custom-cxx-types","title":"高级:自定义 C++ 类型","description":"本指南假设你熟悉 纯 C++ Turbo Native 模块 指南。它将在此基础上进行构建。","sidebar":"docs"},"the-new-architecture/cxx-custom-types":{"id":"the-new-architecture/cxx-custom-types","title":"支持自定义 C++ 类型","description":"默认情况下,C++ Turbo Native 模块支持大多数 std:: 标准类型的桥接功能。"},"the-new-architecture/cxx-cxxturbomodules":{"id":"the-new-architecture/cxx-cxxturbomodules","title":"C++ Turbo 原生模块","description":"本指南将向您展示如何仅使用 C++ 实现 Turbo 原生模块,以便与任何支持的平台(Android、iOS、macOS 或 Windows)共享相同的实现。"},"the-new-architecture/landing-page":{"id":"the-new-architecture/landing-page","title":"新架构介绍","description":"从 0.68 版本开始,React Native 提供了新架构,它为开发者提供了构建高性能和响应式应用的新功能。请访问\\"为何要设计新架构\\"来了解更多关于促使我们决定重新架构的原因,以及它提供的好处。"},"the-new-architecture/pillars":{"id":"the-new-architecture/pillars","title":"新架构的两大支柱","description":"新架构主要由两大支柱组成:"},"the-new-architecture/pillars-codegen":{"id":"the-new-architecture/pillars-codegen","title":"Codegen","description":"Codegen 不算是新架构的主要组成部分,它是一个帮助我们避免编写重复代码的工具。Codegen 并非必选项,您仍然可以手写它所生成的代码,但是使用它来生成脚手架代码可以帮您节省不少时间。"},"the-new-architecture/pillars-fabric-components":{"id":"the-new-architecture/pillars-fabric-components","title":"Fabric 组件","description":"Fabric 组件是一种使用 Fabric 渲染器渲染并展示在屏幕上的 UI 组件。在新架构中,使用 Fabric 组件替代原生组件具有以下优势:"},"the-new-architecture/pillars-turbomodules":{"id":"the-new-architecture/pillars-turbomodules","title":"TurboModules","description":"如果您使用过 React Native,您可能了解过 Native Modules 这个概念。它可以通过 React Native 的「Bridge」帮助 JavaScript 和原生代码进行交互,并使用跨平台的数据格式 JSON 进行通讯。"},"the-new-architecture/pure-cxx-modules":{"id":"the-new-architecture/pure-cxx-modules","title":"纯 C++ Turbo 原生模块","description":"编写 C++ 模块是跨 Android 和 iOS 共享平台无关代码的最佳方式。使用纯 C++ 模块,您只需编写一次逻辑,即可在所有平台上重用它,而无需编写平台特定的代码。","sidebar":"docs"},"the-new-architecture/use-app-template":{"id":"the-new-architecture/use-app-template","title":"创建启用新架构的应用","description":"本文档将帮助你从头创建一个启用了新架构的 React Native 应用。"},"the-new-architecture/using-codegen":{"id":"the-new-architecture/using-codegen","title":"使用 Codegen","description":"本指南将教你如何:","sidebar":"docs"},"the-new-architecture/what-is-codegen":{"id":"the-new-architecture/what-is-codegen","title":"什么是 Codegen?","description":"Codegen 是一个避免编写大量重复代码的工具。使用 Codegen 并不是必须的:您可以手动编写所有生成的代码。然而,Codegen 生成的脚手架代码可以节省您很多时间。","sidebar":"docs"},"the-new-architecture/why":{"id":"the-new-architecture/why","title":"为何要设计新架构","description":"新架构的目标是解决困扰旧架构在性能和灵活性方面的一些问题。本节提供了基本的背景,以了解旧架构的局限性,以及如何通过新架构来克服这些局限性。"},"threading-model":{"id":"threading-model","title":"线程模型","description":"文档介绍了即将发布的新渲染器 Fabric 的架构。"},"timepickerandroid":{"id":"timepickerandroid","title":"🚧 TimePickerAndroid","description":"已过时。 Use @react-native-community/datetimepicker instead."},"timers":{"id":"timers","title":"定时器","description":"定时器是一个应用中非常重要的部分。React Native 实现了和浏览器一致的定时器 Timer。","sidebar":"docs"},"toastandroid":{"id":"toastandroid","title":"ToastAndroid","description":"本模块将原生的 ToastAndroid 模块导出为一个 JS 模块,用于在 Android 设备上显示一个悬浮的提示信息。本模块包含一个show方法接受以下的参数:","sidebar":"api"},"touchablehighlight":{"id":"touchablehighlight","title":"TouchableHighlight","description":"我们建议使用Pressable组件,它更具扩展性且会是官方未来力推的主流。","sidebar":"组件"},"touchablenativefeedback":{"id":"touchablenativefeedback","title":"TouchableNativeFeedback","description":"If you\'re looking for a more extensive and future-proof way to handle touch-based input, check out the Pressable API.","sidebar":"组件"},"touchableopacity":{"id":"touchableopacity","title":"TouchableOpacity","description":"If you\'re looking for a more extensive and future-proof way to handle touch-based input, check out the Pressable API.","sidebar":"组件"},"touchablewithoutfeedback":{"id":"touchablewithoutfeedback","title":"TouchableWithoutFeedback","description":"If you\'re looking for a more extensive and future-proof way to handle touch-based input, check out the Pressable API.","sidebar":"组件"},"transforms":{"id":"transforms","title":"变换(Transform)","description":"变换(Transform)是样式属性,可帮助您使用 2D 或 3D 变换修改组件的外观和位置。然而,即便使用了变换,使用变换的组件的布局并不会变化,因此可能会与附近的组件重叠。您可以对变换的组件、附近的组件应用边距,或对容器应用填充,以防止这种重叠。","sidebar":"api"},"troubleshooting":{"id":"troubleshooting","title":"Troubleshooting","description":"These are some common issues you may run into while setting up React Native. If you encounter something that is not listed here, try searching for the issue in GitHub."},"turbo-native-modules-android":{"id":"turbo-native-modules-android","title":"Turbo 原生模块:Android","description":"现在我们来编写一些 Android 平台代码,以确保 localStorage 在应用关闭后仍然可以持久保存数据。"},"turbo-native-modules-introduction":{"id":"turbo-native-modules-introduction","title":"Turbo 原生模块介绍","description":"你的 React Native 应用代码可能需要与 React Native 或现有库未提供的原生平台 API 进行交互。你可以使用 Turbo 原生模块 自己编写集成代码。本指南将向你展示如何编写一个。","sidebar":"docs"},"turbo-native-modules-ios":{"id":"turbo-native-modules-ios","title":"Turbo 原生模块:iOS","description":"现在我们来编写一些 iOS 平台代码,以确保 localStorage 在应用关闭后仍然可以持久保存数据。"},"tutorial":{"id":"tutorial","title":"示例教程:Hello World","description":"React Native 看起来很像 React,只不过其基础组件是原生组件而非 web 组件。要理解 React Native 应用的基本结构,首先需要了解一些基本的 React 的概念,比如 JSX 语法、组件、state状态以及props属性。如果你已经了解了 React,那么还需要掌握一些 React Native 特有的知识,比如原生组件的使用。这篇教程可以供任何基础的读者学习,不管你是否有 React 方面的经验。"},"typescript":{"id":"typescript","title":"使用 TypeScript","description":"TypeScript 是一种通过添加类型定义来扩展 JavaScript 的语言。新的 React Native 项目默认以 TypeScript 为目标,同时也支持 JavaScript 和 Flow。","sidebar":"docs"},"upgrading":{"id":"upgrading","title":"更新","description":"时刻将 React Native 更新到最新的版本,可以获得更多 API、视图、开发者工具以及其他一些好东西(译注:官方开发任务繁重,人手紧缺,几乎不会对旧版本提供维护支持,所以即便更新可能带来一些兼容上的变更,但建议开发者还是尽一切可能第一时间更新)。由于一个完整的 React Native 项目是由 Android 项目、iOS 项目和 JavaScript 项目组成的,且都打包在一个 npm 包中,所以升级可能会有一些麻烦。我们会尽量简化这一流程。你可以在项目目录下使用npx react-native info命令查看当前的版本。","sidebar":"docs"},"usecolorscheme":{"id":"usecolorscheme","title":"useColorScheme","description":"useColorScheme 这个React hook 提供并订阅来自Appearance模块的颜色方案更新。返回值表示当前用户首选的颜色方案。该值可以稍后通过直接用户动作(例如,设备设置中的主题选择)或根据时间表(例如,遵循白天/夜晚周期的亮主题和暗主题)来更新。","sidebar":"api"},"usewindowdimensions":{"id":"usewindowdimensions","title":"useWindowDimensions","description":"useWindowDimensions会在屏幕尺寸变化时自动更新获取到的设备width和height值。使用方法如下:","sidebar":"api"},"using-a-listview":{"id":"using-a-listview","title":"使用长列表","description":"React Native 提供了几个适用于展示长列表数据的组件,一般而言我们会选用FlatList或是SectionList。","sidebar":"docs"},"using-a-scrollview":{"id":"using-a-scrollview","title":"使用滚动视图","description":"ScrollView是一个通用的可滚动的容器,你可以在其中放入多个组件和视图,而且这些组件并不需要是同类型的。ScrollView 不仅可以垂直滚动,还能水平滚动(通过horizontal属性来设置)。","sidebar":"docs"},"vibration":{"id":"vibration","title":"Vibration","description":"使设备振动。","sidebar":"api"},"view":{"id":"view","title":"View","description":"作为创建 UI 时最基础的组件,View 是一个支持 Flexbox 布局、样式、触摸响应、和一些无障碍功能的容器。不论在什么平台上,View 都直接对应当前平台的原生视图,无论它是 UIView、div 还是 android.view.View。","sidebar":"组件"},"view-flattening":{"id":"view-flattening","title":"视图拍平","description":"This document refers to the architecture of the new renderer, Fabric, that is in active roll-out."},"view-style-props":{"id":"view-style-props","title":"View 样式属性","description":"示例","sidebar":"组件"},"viewpagerandroid":{"id":"viewpagerandroid","title":"🚧 ViewPagerAndroid","description":"已过时。 Use @react-native-community/viewpager instead."},"viewtoken":{"id":"viewtoken","title":"ViewToken 对象","description":"ViewToken object is returned as one of properties in the onViewableItemsChanged callback, for example in FlatList component. It is exported by ViewabilityHelper.js.","sidebar":"组件"},"virtualizedlist":{"id":"virtualizedlist","title":"VirtualizedList","description":"FlatList和SectionList的底层实现。FlatList 和 SectionList 使用起来更方便,同时也有相对更详细的文档。一般来说,仅当想获得比 FlatList 更高的灵活性(比如说在使用 immutable data 而不是 普通数组)的时候,你才应该考虑使用 VirtualizedList。","sidebar":"组件"},"xplat-implementation":{"id":"xplat-implementation","title":"跨平台的实现","description":"This document refers to the architecture of the new renderer, Fabric, that is in active roll-out."}}}}'); - -/***/ }) - -}; -; \ No newline at end of file diff --git a/assets/js/0058b4c6.f8efbbe3.js b/assets/js/0058b4c6.f8efbbe3.js deleted file mode 100644 index 2457012e90b..00000000000 --- a/assets/js/0058b4c6.f8efbbe3.js +++ /dev/null @@ -1 +0,0 @@ -"use strict";(self.webpackChunkreact_native_website=self.webpackChunkreact_native_website||[]).push([[90849],{86164:e=>{e.exports=JSON.parse('{"version":{"pluginId":"default","version":"0.76","label":"0.76","banner":null,"badge":false,"noIndex":false,"className":"docs-version-0.76","isLast":true,"docsSidebars":{"docs":[{"type":"category","label":"\u5165\u95e8\u57fa\u7840","items":[{"type":"link","label":"\u7b80\u4ecb","href":"/docs/getting-started","docId":"getting-started","unlisted":false},{"type":"link","label":"\u6838\u5fc3\u7ec4\u4ef6\u4e0e\u539f\u751f\u7ec4\u4ef6","href":"/docs/intro-react-native-components","docId":"intro-react-native-components","unlisted":false},{"type":"link","label":"React \u57fa\u7840","href":"/docs/intro-react","docId":"intro-react","unlisted":false},{"type":"link","label":"\u5904\u7406\u6587\u672c\u8f93\u5165","href":"/docs/handling-text-input","docId":"handling-text-input","unlisted":false},{"type":"link","label":"\u4f7f\u7528\u6eda\u52a8\u89c6\u56fe","href":"/docs/using-a-scrollview","docId":"using-a-scrollview","unlisted":false},{"type":"link","label":"\u4f7f\u7528\u957f\u5217\u8868","href":"/docs/using-a-listview","docId":"using-a-listview","unlisted":false},{"type":"link","label":"\u7279\u5b9a\u5e73\u53f0\u4ee3\u7801","href":"/docs/platform-specific-code","docId":"platform-specific-code","unlisted":false},{"type":"link","label":"\u5176\u4ed6\u53c2\u8003\u8d44\u6e90","href":"/docs/more-resources","docId":"more-resources","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"\u73af\u5883\u642d\u5efa","items":[{"type":"link","label":"\u642d\u5efa\u5f00\u53d1\u73af\u5883","href":"/docs/environment-setup","docId":"environment-setup","unlisted":false},{"type":"link","label":"\u96c6\u6210\u5230\u73b0\u6709\u539f\u751f\u5e94\u7528","href":"/docs/integration-with-existing-apps","docId":"integration-with-existing-apps","unlisted":false},{"type":"link","label":"\u96c6\u6210\u5230 Android Fragment","href":"/docs/integration-with-android-fragment","docId":"integration-with-android-fragment","unlisted":false},{"type":"link","label":"\u4e3a\u7535\u89c6\u548c\u673a\u9876\u76d2\u5236\u4f5c\u5e94\u7528","href":"/docs/building-for-tv","docId":"building-for-tv","unlisted":false},{"type":"link","label":"\u591a\u5e73\u53f0\u652f\u6301","href":"/docs/out-of-tree-platforms","docId":"out-of-tree-platforms","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"\u5f00\u53d1\u6d41\u7a0b","items":[{"type":"link","label":"\u5728\u8bbe\u5907\u4e0a\u8fd0\u884c","href":"/docs/running-on-device","docId":"running-on-device","unlisted":false},{"type":"link","label":"\u5feb\u901f\u5237\u65b0","href":"/docs/fast-refresh","docId":"fast-refresh","unlisted":false},{"type":"link","label":"Metro","href":"/docs/metro","docId":"metro","unlisted":false},{"type":"link","label":"\u4f7f\u7528\u7b2c\u4e09\u65b9\u5e93","href":"/docs/libraries","docId":"libraries","unlisted":false},{"type":"link","label":"\u4f7f\u7528 TypeScript","href":"/docs/typescript","docId":"typescript","unlisted":false},{"type":"link","label":"\u66f4\u65b0","href":"/docs/upgrading","docId":"upgrading","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"\u754c\u9762\u4e0e\u4ea4\u4e92","items":[{"type":"link","label":"\u6837\u5f0f","href":"/docs/style","docId":"style","unlisted":false},{"type":"link","label":"\u9ad8\u5ea6\u4e0e\u5bbd\u5ea6","href":"/docs/height-and-width","docId":"height-and-width","unlisted":false},{"type":"link","label":"\u4f7f\u7528 Flexbox \u5e03\u5c40","href":"/docs/flexbox","docId":"flexbox","unlisted":false},{"type":"link","label":"\u56fe\u7247","href":"/docs/images","docId":"images","unlisted":false},{"type":"link","label":"\u989c\u8272","href":"/docs/colors","docId":"colors","unlisted":false},{"type":"category","label":"\u4ea4\u4e92","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"\u5904\u7406\u89e6\u6478\u4e8b\u4ef6","href":"/docs/handling-touches","docId":"handling-touches","unlisted":false},{"type":"link","label":"\u4f7f\u7528\u5bfc\u822a\u5668\u8df3\u8f6c\u9875\u9762","href":"/docs/navigation","docId":"navigation","unlisted":false},{"type":"link","label":"\u52a8\u753b","href":"/docs/animations","docId":"animations","unlisted":false},{"type":"link","label":"\u624b\u52bf\u54cd\u5e94\u7cfb\u7edf","href":"/docs/gesture-responder-system","docId":"gesture-responder-system","unlisted":false}]},{"type":"category","label":"\u7f51\u7edc\u8fde\u63a5","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"\u8bbf\u95ee\u7f51\u7edc","href":"/docs/network","docId":"network","unlisted":false},{"type":"link","label":"\u7f51\u7edc\u5b89\u5168\u7b56\u7565","href":"/docs/security","docId":"security","unlisted":false}]},{"type":"category","label":"\u5305\u5bb9\u6027","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"\u65e0\u969c\u788d\u529f\u80fd","href":"/docs/accessibility","docId":"accessibility","unlisted":false}]}],"collapsed":true,"collapsible":true},{"type":"category","label":"\u8c03\u8bd5","items":[{"type":"link","label":"\u8c03\u8bd5","href":"/docs/debugging","docId":"debugging","unlisted":false},{"type":"link","label":"React Native \u5f00\u53d1\u8005\u5de5\u5177","href":"/docs/react-native-devtools","docId":"react-native-devtools","unlisted":false},{"type":"link","label":"\u8c03\u8bd5\u539f\u751f\u4ee3\u7801","href":"/docs/debugging-native-code","docId":"debugging-native-code","unlisted":false},{"type":"link","label":"\u8c03\u8bd5\u53d1\u884c\u7248\u672c","href":"/docs/debugging-release-builds","docId":"debugging-release-builds","unlisted":false},{"type":"link","label":"\u5176\u4ed6\u8c03\u8bd5\u65b9\u6cd5","href":"/docs/other-debugging-methods","docId":"other-debugging-methods","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"\u6d4b\u8bd5","items":[{"type":"link","label":"Testing","href":"/docs/testing-overview","docId":"testing-overview","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"\u6027\u80fd\u8c03\u4f18","items":[{"type":"link","label":"\u6027\u80fd\u7efc\u8ff0","href":"/docs/performance","docId":"performance","unlisted":false},{"type":"link","label":"\u4f18\u5316\u7f16\u8bd1\u901f\u5ea6","href":"/docs/build-speed","docId":"build-speed","unlisted":false},{"type":"link","label":"\u5217\u8868\u914d\u7f6e\u4f18\u5316","href":"/docs/optimizing-flatlist-configuration","docId":"optimizing-flatlist-configuration","unlisted":false},{"type":"link","label":"Optimizing JavaScript loading","href":"/docs/optimizing-javascript-loading","docId":"optimizing-javascript-loading","unlisted":false},{"type":"link","label":"Profiling","href":"/docs/profiling","docId":"profiling","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"JavaScript \u8fd0\u884c\u73af\u5883","items":[{"type":"link","label":"JavaScript \u73af\u5883","href":"/docs/javascript-environment","docId":"javascript-environment","unlisted":false},{"type":"link","label":"\u5b9a\u65f6\u5668","href":"/docs/timers","docId":"timers","unlisted":false},{"type":"link","label":"\u4f7f\u7528\u65b0\u7684 Hermes \u5f15\u64ce","href":"/docs/hermes","docId":"hermes","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"Codegen","items":[{"type":"link","label":"\u4ec0\u4e48\u662f Codegen\uff1f","href":"/docs/the-new-architecture/what-is-codegen","docId":"the-new-architecture/what-is-codegen","unlisted":false},{"type":"link","label":"\u4f7f\u7528 Codegen","href":"/docs/the-new-architecture/using-codegen","docId":"the-new-architecture/using-codegen","unlisted":false},{"type":"link","label":"Codegen \u547d\u4ee4\u884c\u5de5\u5177","href":"/docs/the-new-architecture/codegen-cli","docId":"the-new-architecture/codegen-cli","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"\u539f\u751f\u5f00\u53d1","items":[{"type":"link","label":"\u6865\u63a5\u539f\u751f\u5e73\u53f0\u80fd\u529b","href":"/docs/native-platform","docId":"native-platform","unlisted":false},{"type":"category","label":"\u539f\u751f\u6a21\u5757","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"Turbo \u539f\u751f\u6a21\u5757\u4ecb\u7ecd","href":"/docs/turbo-native-modules-introduction","docId":"turbo-native-modules-introduction","unlisted":false},{"type":"link","label":"\u7eaf C++ Turbo \u539f\u751f\u6a21\u5757","href":"/docs/the-new-architecture/pure-cxx-modules","docId":"the-new-architecture/pure-cxx-modules","unlisted":false},{"type":"link","label":"\u9ad8\u7ea7\uff1a\u81ea\u5b9a\u4e49 C++ \u7c7b\u578b","href":"/docs/the-new-architecture/custom-cxx-types","docId":"the-new-architecture/custom-cxx-types","unlisted":false}]},{"type":"category","label":"\u539f\u751f UI \u7ec4\u4ef6","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"Fabric Native Components Introduction","href":"/docs/fabric-native-components-introduction","docId":"fabric-native-components-introduction","unlisted":false}]},{"type":"category","label":"\u5176\u4ed6","collapsible":true,"collapsed":true,"items":[{"type":"link","label":"appendix","href":"/docs/appendix","docId":"appendix","unlisted":false},{"type":"link","label":"\u521b\u5efa\u6a21\u5757\u5e93","href":"/docs/the-new-architecture/create-module-library","docId":"the-new-architecture/create-module-library","unlisted":false}]}],"collapsed":true,"collapsible":true},{"type":"category","label":"Android \u4e0e iOS \u6307\u5357","items":[{"type":"category","label":"Android","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"Headless JS\uff08\u540e\u53f0\u4efb\u52a1\uff09","href":"/docs/headless-js-android","docId":"headless-js-android","unlisted":false},{"type":"link","label":"\u6253\u5305\u53d1\u5e03","href":"/docs/signed-apk-android","docId":"signed-apk-android","unlisted":false},{"type":"link","label":"\u548c\u539f\u751f\u7aef\u901a\u4fe1","href":"/docs/communication-android","docId":"communication-android","unlisted":false},{"type":"link","label":"React Native Gradle Plugin","href":"/docs/react-native-gradle-plugin","docId":"react-native-gradle-plugin","unlisted":false}]},{"type":"category","label":"iOS","collapsible":false,"collapsed":false,"items":[{"type":"link","label":"\u94fe\u63a5\u539f\u751f\u5e93","href":"/docs/linking-libraries-ios","docId":"linking-libraries-ios","unlisted":false},{"type":"link","label":"\u5728iOS\u6a21\u62df\u5668\u4e0a\u8fd0\u884c","href":"/docs/running-on-simulator-ios","docId":"running-on-simulator-ios","unlisted":false},{"type":"link","label":"\u548c\u539f\u751f\u7aef\u901a\u4fe1","href":"/docs/communication-ios","docId":"communication-ios","unlisted":false},{"type":"link","label":"iOS \u5e94\u7528\u5c0f\u7ec4\u4ef6","href":"/docs/app-extensions","docId":"app-extensions","unlisted":false},{"type":"link","label":"\u4e0a\u67b6 App Store","href":"/docs/publishing-to-app-store","docId":"publishing-to-app-store","unlisted":false}]}],"collapsed":true,"collapsible":true},{"type":"category","label":"\u65e7\u67b6\u6784","items":[{"type":"category","label":"\u539f\u751f\u6a21\u5757\uff08\u65e7\u67b6\u6784\uff09","collapsible":true,"collapsed":true,"items":[{"type":"link","label":"\u539f\u751f\u6a21\u5757\u7b80\u4ecb","href":"/docs/legacy/native-modules-intro","docId":"legacy/native-modules-intro","unlisted":false},{"type":"link","label":"Android \u539f\u751f\u6a21\u5757","href":"/docs/legacy/native-modules-android","docId":"legacy/native-modules-android","unlisted":false},{"type":"link","label":"iOS \u539f\u751f\u6a21\u5757","href":"/docs/legacy/native-modules-ios","docId":"legacy/native-modules-ios","unlisted":false},{"type":"link","label":"Native Modules NPM Package Setup","href":"/docs/legacy/native-modules-setup","docId":"legacy/native-modules-setup","unlisted":false},{"type":"link","label":"Local libraries setup","href":"/docs/legacy/local-library-setup","docId":"legacy/local-library-setup","unlisted":false}]},{"type":"category","label":"\u539f\u751f UI \u7ec4\u4ef6\uff08\u65e7\u67b6\u6784\uff09","collapsible":true,"collapsed":true,"items":[{"type":"link","label":"Android \u539f\u751fUI\u7ec4\u4ef6","href":"/docs/legacy/native-components-android","docId":"legacy/native-components-android","unlisted":false},{"type":"link","label":"iOS \u539f\u751fUI\u7ec4\u4ef6","href":"/docs/legacy/native-components-ios","docId":"legacy/native-components-ios","unlisted":false},{"type":"link","label":"\u76f4\u63a5\u64cd\u4f5c","href":"/docs/legacy/direct-manipulation","docId":"legacy/direct-manipulation","unlisted":false}]}],"collapsed":true,"collapsible":true}],"api":[{"type":"category","label":"APIs","items":[{"type":"link","label":"AccessibilityInfo","href":"/docs/accessibilityinfo","docId":"accessibilityinfo","unlisted":false},{"type":"link","label":"Alert","href":"/docs/alert","docId":"alert","unlisted":false},{"type":"link","label":"Animated","href":"/docs/animated","docId":"animated","unlisted":false},{"type":"link","label":"Animated.Value","href":"/docs/animatedvalue","docId":"animatedvalue","unlisted":false},{"type":"link","label":"Animated.ValueXY","href":"/docs/animatedvaluexy","docId":"animatedvaluexy","unlisted":false},{"type":"link","label":"Appearance","href":"/docs/appearance","docId":"appearance","unlisted":false},{"type":"link","label":"AppRegistry","href":"/docs/appregistry","docId":"appregistry","unlisted":false},{"type":"link","label":"AppState","href":"/docs/appstate","docId":"appstate","unlisted":false},{"type":"link","label":"DevSettings","href":"/docs/devsettings","docId":"devsettings","unlisted":false},{"type":"link","label":"Dimensions","href":"/docs/dimensions","docId":"dimensions","unlisted":false},{"type":"link","label":"Easing","href":"/docs/easing","docId":"easing","unlisted":false},{"type":"link","label":"InteractionManager","href":"/docs/interactionmanager","docId":"interactionmanager","unlisted":false},{"type":"link","label":"Keyboard","href":"/docs/keyboard","docId":"keyboard","unlisted":false},{"type":"link","label":"LayoutAnimation","href":"/docs/layoutanimation","docId":"layoutanimation","unlisted":false},{"type":"link","label":"Linking","href":"/docs/linking","docId":"linking","unlisted":false},{"type":"link","label":"PanResponder","href":"/docs/panresponder","docId":"panresponder","unlisted":false},{"type":"link","label":"PixelRatio","href":"/docs/pixelratio","docId":"pixelratio","unlisted":false},{"type":"link","label":"Platform","href":"/docs/platform","docId":"platform","unlisted":false},{"type":"link","label":"PlatformColor","href":"/docs/platformcolor","docId":"platformcolor","unlisted":false},{"type":"link","label":"RootTag","href":"/docs/roottag","docId":"roottag","unlisted":false},{"type":"link","label":"Share","href":"/docs/share","docId":"share","unlisted":false},{"type":"link","label":"StyleSheet","href":"/docs/stylesheet","docId":"stylesheet","unlisted":false},{"type":"link","label":"Systrace","href":"/docs/systrace","docId":"systrace","unlisted":false},{"type":"link","label":"\u53d8\u6362\uff08Transform\uff09","href":"/docs/transforms","docId":"transforms","unlisted":false},{"type":"link","label":"Vibration","href":"/docs/vibration","docId":"vibration","unlisted":false},{"type":"category","label":"Hooks","collapsed":false,"items":[{"type":"link","label":"useColorScheme","href":"/docs/usecolorscheme","docId":"usecolorscheme","unlisted":false},{"type":"link","label":"useWindowDimensions","href":"/docs/usewindowdimensions","docId":"usewindowdimensions","unlisted":false}],"collapsible":true},{"type":"category","label":"Android API","collapsed":false,"items":[{"type":"link","label":"BackHandler","href":"/docs/backhandler","docId":"backhandler","unlisted":false},{"type":"link","label":"PermissionsAndroid","href":"/docs/permissionsandroid","docId":"permissionsandroid","unlisted":false},{"type":"link","label":"ToastAndroid","href":"/docs/toastandroid","docId":"toastandroid","unlisted":false}],"collapsible":true},{"type":"category","label":"iOS API","collapsed":false,"items":[{"type":"link","label":"ActionSheetIOS","href":"/docs/actionsheetios","docId":"actionsheetios","unlisted":false},{"type":"link","label":"DynamicColorIOS","href":"/docs/dynamiccolorios","docId":"dynamiccolorios","unlisted":false},{"type":"link","label":"Settings","href":"/docs/settings","docId":"settings","unlisted":false}],"collapsible":true}],"collapsed":true,"collapsible":true}],"\u7ec4\u4ef6":[{"type":"category","label":"\u6838\u5fc3\u7ec4\u4ef6","items":[{"type":"link","label":"\u6838\u5fc3\u7ec4\u4ef6\u548cAPI","href":"/docs/components-and-apis","docId":"components-and-apis","unlisted":false},{"type":"link","label":"ActivityIndicator","href":"/docs/activityindicator","docId":"activityindicator","unlisted":false},{"type":"link","label":"Button","href":"/docs/button","docId":"button","unlisted":false},{"type":"link","label":"FlatList","href":"/docs/flatlist","docId":"flatlist","unlisted":false},{"type":"link","label":"Image","href":"/docs/image","docId":"image","unlisted":false},{"type":"link","label":"ImageBackground","href":"/docs/imagebackground","docId":"imagebackground","unlisted":false},{"type":"link","label":"KeyboardAvoidingView","href":"/docs/keyboardavoidingview","docId":"keyboardavoidingview","unlisted":false},{"type":"link","label":"Modal","href":"/docs/modal","docId":"modal","unlisted":false},{"type":"link","label":"Pressable","href":"/docs/pressable","docId":"pressable","unlisted":false},{"type":"link","label":"RefreshControl","href":"/docs/refreshcontrol","docId":"refreshcontrol","unlisted":false},{"type":"link","label":"ScrollView","href":"/docs/scrollview","docId":"scrollview","unlisted":false},{"type":"link","label":"SectionList","href":"/docs/sectionlist","docId":"sectionlist","unlisted":false},{"type":"link","label":"StatusBar","href":"/docs/statusbar","docId":"statusbar","unlisted":false},{"type":"link","label":"Switch","href":"/docs/switch","docId":"switch","unlisted":false},{"type":"link","label":"Text","href":"/docs/text","docId":"text","unlisted":false},{"type":"link","label":"TextInput","href":"/docs/textinput","docId":"textinput","unlisted":false},{"type":"link","label":"TouchableHighlight","href":"/docs/touchablehighlight","docId":"touchablehighlight","unlisted":false},{"type":"link","label":"TouchableOpacity","href":"/docs/touchableopacity","docId":"touchableopacity","unlisted":false},{"type":"link","label":"TouchableWithoutFeedback","href":"/docs/touchablewithoutfeedback","docId":"touchablewithoutfeedback","unlisted":false},{"type":"link","label":"View","href":"/docs/view","docId":"view","unlisted":false},{"type":"link","label":"VirtualizedList","href":"/docs/virtualizedlist","docId":"virtualizedlist","unlisted":false},{"type":"category","label":"Android \u7ec4\u4ef6","collapsed":false,"items":[{"type":"link","label":"DrawerLayoutAndroid","href":"/docs/drawerlayoutandroid","docId":"drawerlayoutandroid","unlisted":false},{"type":"link","label":"TouchableNativeFeedback","href":"/docs/touchablenativefeedback","docId":"touchablenativefeedback","unlisted":false}],"collapsible":true},{"type":"category","label":"iOS \u7ec4\u4ef6","collapsed":false,"items":[{"type":"link","label":"InputAccessoryView","href":"/docs/inputaccessoryview","docId":"inputaccessoryview","unlisted":false},{"type":"link","label":"SafeAreaView","href":"/docs/safeareaview","docId":"safeareaview","unlisted":false}],"collapsible":true}],"collapsed":true,"collapsible":true},{"type":"category","label":"Props","items":[{"type":"link","label":"\u56fe\u7247\u6837\u5f0f\u5c5e\u6027","href":"/docs/image-style-props","docId":"image-style-props","unlisted":false},{"type":"link","label":"\u5e03\u5c40\u5c5e\u6027","href":"/docs/layout-props","docId":"layout-props","unlisted":false},{"type":"link","label":"\u9634\u5f71\u6837\u5f0f\u5c5e\u6027","href":"/docs/shadow-props","docId":"shadow-props","unlisted":false},{"type":"link","label":"Text \u6837\u5f0f\u5c5e\u6027","href":"/docs/text-style-props","docId":"text-style-props","unlisted":false},{"type":"link","label":"View \u6837\u5f0f\u5c5e\u6027","href":"/docs/view-style-props","docId":"view-style-props","unlisted":false}],"collapsed":true,"collapsible":true},{"type":"category","label":"\u5185\u90e8\u5bf9\u8c61\u7c7b\u578b","items":[{"type":"link","label":"\u5e03\u5c40\u4e8b\u4ef6\u5bf9\u8c61","href":"/docs/layoutevent","docId":"layoutevent","unlisted":false},{"type":"link","label":"\u70b9\u51fb\u4e8b\u4ef6\u5bf9\u8c61","href":"/docs/pressevent","docId":"pressevent","unlisted":false},{"type":"link","label":"React \u8282\u70b9\u5bf9\u8c61","href":"/docs/react-node","docId":"react-node","unlisted":false},{"type":"link","label":"\u77e9\u5f62\u533a\u57df\u5bf9\u8c61","href":"/docs/rect","docId":"rect","unlisted":false},{"type":"link","label":"ViewToken \u5bf9\u8c61","href":"/docs/viewtoken","docId":"viewtoken","unlisted":false}],"collapsed":true,"collapsible":true}]},"docs":{"accessibility":{"id":"accessibility","title":"\u65e0\u969c\u788d\u529f\u80fd","description":"\u8bd1\u6ce8\uff1aaccessibility \u4e00\u8bcd\u5e38\u89c1\u591a\u79cd\u8bd1\u6cd5\uff1a\u53ef\u8bbf\u95ee\u6027\u3001\u65e0\u969c\u788d\u6027\u3001\u8f85\u52a9\u529f\u80fd\u7b49\u7b49\uff0c\u5176\u4e2d\u6587\u610f\u601d\u90fd\u4e0d\u592a\u80fd\u51c6\u786e\u8868\u8fbe\u5176\u529f\u80fd\u7684\u672c\u8d28\u2014\u2014\u5373\u4e3a\u6b8b\u969c\u4eba\u58eb\u63d0\u4f9b\u4fbf\u5229\u3002\u672c\u6587\u4e3b\u8981\u91c7\u7528\u201c\u65e0\u969c\u788d\u529f\u80fd\u201d\u548c\u201c\u8f85\u52a9\u6280\u672f/\u670d\u52a1\u201d\u7684\u8bf4\u6cd5\u3002\u5982\u679c\u4f60\u6216\u4f60\u7684\u516c\u53f8\u6682\u65f6\u6ca1\u6709\u8d44\u6e90\u548c\u7cbe\u529b\u53bb\u670d\u52a1\u8fd9\u4e9b\u7528\u6237\uff0c\u90a3\u4e48\u4f60\u53ef\u4ee5\u8df3\u8fc7\u672c\u6587\u3002\u4f46\u662f\uff0c\u8bd1\u8005\u4e2a\u4eba\u5e0c\u671b\u501f\u672c\u6587\u6863\uff0c\u547c\u5401\u6709\u80fd\u529b\u6709\u8d44\u6e90\u7684\u5546\u4e1a\u516c\u53f8/\u7ec4\u7ec7/\u4e2a\u4eba\uff0c\u91cd\u89c6\u6b8b\u969c\u4eba\u58eb\u4f7f\u7528\u667a\u80fd\u624b\u673a\u7684\u6743\u5229\u3002","sidebar":"docs"},"accessibilityinfo":{"id":"accessibilityinfo","title":"AccessibilityInfo","description":"\u6709\u65f6\u5019\u6211\u4eec\u5e0c\u671b\u77e5\u9053\u7528\u6237\u7684\u8bbe\u5907\u662f\u5426\u6b63\u5728\u8fd0\u884c\u8bfb\u5c4f\u5e94\u7528\u3002AccessibilityInfo\u6b63\u662f\u7528\u4e8e\u6b64\u76ee\u7684\u3002\u4f60\u53ef\u4ee5\u7528\u5b83\u6765\u67e5\u8be2\u8bfb\u5c4f\u5e94\u7528\u7684\u5f53\u524d\u72b6\u6001\uff0c\u5e76\u4e14\u53ef\u4ee5\u76d1\u542c\u5176\u72b6\u6001\u53d8\u5316\u3002","sidebar":"api"},"actionsheetios":{"id":"actionsheetios","title":"ActionSheetIOS","description":"\u663e\u793a\u4e00\u4e2a iOS \u539f\u751f\u7684Action Sheet\u7ec4\u4ef6\u3002","sidebar":"api"},"activityindicator":{"id":"activityindicator","title":"ActivityIndicator","description":"\u663e\u793a\u4e00\u4e2a\u5706\u5f62\u7684 loading \u63d0\u793a\u7b26\u53f7\u3002","sidebar":"\u7ec4\u4ef6"},"alert":{"id":"alert","title":"Alert","description":"\u542f\u52a8\u4e00\u4e2a\u63d0\u793a\u5bf9\u8bdd\u6846\uff0c\u5305\u542b\u5bf9\u5e94\u7684\u6807\u9898\u548c\u4fe1\u606f\u3002","sidebar":"api"},"alertios":{"id":"alertios","title":"AlertIOS","description":"AlertIOS\u7528\u4e8e\u5f39\u51fa\u4e00\u4e2a iOS \u63d0\u793a\u5bf9\u8bdd\u6846\uff0c\u53ef\u4ee5\u901a\u77e5\u7528\u6237\u4e00\u4e9b\u4fe1\u606f\u6216\u662f\u63d0\u793a\u7528\u6237\u8f93\u5165\u4e00\u4e9b\u6587\u5b57\u3002"},"animated":{"id":"animated","title":"Animated","description":"Animated\u5e93\u65e8\u5728\u4f7f\u52a8\u753b\u53d8\u5f97\u6d41\u7545\uff0c\u5f3a\u5927\u5e76\u6613\u4e8e\u6784\u5efa\u548c\u7ef4\u62a4\u3002Animated\u4fa7\u91cd\u4e8e\u8f93\u5165\u548c\u8f93\u51fa\u4e4b\u95f4\u7684\u58f0\u660e\u6027\u5173\u7cfb\uff0c\u4ee5\u53ca\u4e24\u8005\u4e4b\u95f4\u7684\u53ef\u914d\u7f6e\u53d8\u6362\uff0c\u6b64\u5916\u8fd8\u63d0\u4f9b\u4e86\u7b80\u5355\u7684 start/stop\u65b9\u6cd5\u6765\u63a7\u5236\u57fa\u4e8e\u65f6\u95f4\u7684\u52a8\u753b\u6267\u884c\u3002","sidebar":"api"},"animatedvalue":{"id":"animatedvalue","title":"Animated.Value","description":"\u9a71\u52a8\u52a8\u753b\u7684\u4e00\u7ef4\u6807\u91cf\u503c. \u4e00\u4e2aAnimated.Value\u53ef\u4ee5\u540c\u6b65\u5730\u9a71\u52a8\u591a\u4e2a\u5c5e\u6027\uff0c\u4f46\u6bcf\u6b21\u53ea\u80fd\u4ee5\u4e00\u79cd\u52a8\u753b\u673a\u5236\u53d8\u5316\u3002\u5982\u679c\u6539\u7528\u4e86\u5176\u4ed6\u52a8\u753b\u673a\u5236\uff08\u4f8b\u5982\u5f00\u59cb\u4e00\u4e2a\u65b0\u7684\u52a8\u753b\u6216\u662f\u8c03\u7528setValue\uff09\uff0c\u5219\u4f1a\u505c\u6b62\u5148\u524d\u7684\u52a8\u753b\u3002","sidebar":"api"},"animatedvaluexy":{"id":"animatedvaluexy","title":"Animated.ValueXY","description":"2D \u503c\u7528\u4e8e\u9a71\u52a8 2D \u52a8\u753b\uff0c\u4f8b\u5982\u5e73\u79fb\u624b\u52bf\u3002\u4e0e\u666e\u901a\u7684Animated.Value\u51e0\u4e4e\u76f8\u540c\u7684 API\uff0c\u4f46\u662f\u53ef\u4ee5\u591a\u8def\u590d\u7528\u3002\u5728\u5185\u90e8\u5305\u542b\u4e24\u4e2a\u5e38\u89c4\u7684Animated.Value\u3002","sidebar":"api"},"animations":{"id":"animations","title":"\u52a8\u753b","description":"\u6d41\u7545\u3001\u6709\u610f\u4e49\u7684\u52a8\u753b\u5bf9\u4e8e\u79fb\u52a8\u5e94\u7528\u7528\u6237\u4f53\u9a8c\u6765\u8bf4\u662f\u975e\u5e38\u91cd\u8981\u7684\u3002\u73b0\u5b9e\u751f\u6d3b\u4e2d\u7684\u7269\u4f53\u5728\u5f00\u59cb\u79fb\u52a8\u548c\u505c\u4e0b\u6765\u7684\u65f6\u5019\u90fd\u5177\u6709\u4e00\u5b9a\u7684\u60ef\u6027\uff0c\u6211\u4eec\u5728\u754c\u9762\u4e2d\u4e5f\u53ef\u4ee5\u4f7f\u7528\u52a8\u753b\u6765\u5b9e\u73b0\u5951\u5408\u7269\u7406\u89c4\u5f8b\u7684\u4ea4\u4e92\u3002","sidebar":"docs"},"app-extensions":{"id":"app-extensions","title":"iOS \u5e94\u7528\u5c0f\u7ec4\u4ef6","description":"\u5c0f\u7ec4\u4ef6\u5141\u8bb8\u60a8\u5728\u4e3b\u8981\u5e94\u7528\u7a0b\u5e8f\u4e4b\u5916\u63d0\u4f9b\u81ea\u5b9a\u4e49\u529f\u80fd\u548c\u5185\u5bb9\u3002iOS\u4e0a\u6709\u4e0d\u540c\u7c7b\u578b\u7684\u5e94\u7528\u5c0f\u7ec4\u4ef6\uff0c\u5b83\u4eec\u90fd\u5728App Extension\u7f16\u7a0b\u6307\u5357\u4e2d\u8fdb\u884c\u4e86\u4ecb\u7ecd\u3002\u5728\u672c\u6307\u5357\u4e2d\uff0c\u6211\u4eec\u5c06\u7b80\u8981\u4ecb\u7ecd\u5982\u4f55\u5728iOS\u4e0a\u5229\u7528\u5e94\u7528\u5c0f\u7ec4\u4ef6\u7684\u4f18\u52bf\u3002","sidebar":"docs"},"appearance":{"id":"appearance","title":"Appearance","description":"Appearance \u6a21\u5757\u63d0\u4f9b\u4e86\u5173\u4e8e\u7528\u6237\u5916\u89c2\u504f\u597d\u7684\u4fe1\u606f\uff0c\u4f8b\u5982\u4ed6\u4eec\u559c\u6b22\u7684\u989c\u8272\u65b9\u6848\uff08\u660e\u4eae\u6216\u6697\u9ed1\uff09\u3002","sidebar":"api"},"appendix":{"id":"appendix","title":"appendix","description":"\u4e00\u3001\u672f\u8bed","sidebar":"docs"},"appregistry":{"id":"appregistry","title":"AppRegistry","description":"\u4ec5\u9002\u7528\u4e8e\u975e\u6c99\u76d2\u9879\u76ee","sidebar":"api"},"appstate":{"id":"appstate","title":"AppState","description":"AppState\u80fd\u544a\u8bc9\u4f60\u5e94\u7528\u5f53\u524d\u662f\u5728\u524d\u53f0\u8fd8\u662f\u5728\u540e\u53f0\uff0c\u5e76\u4e14\u80fd\u5728\u72b6\u6001\u53d8\u5316\u7684\u65f6\u5019\u901a\u77e5\u4f60\u3002","sidebar":"api"},"architecture-glossary":{"id":"architecture-glossary","title":"\u672f\u8bed\u8868","description":"Fabric \u6e32\u67d3\u5668\uff08Fabric Renderer\uff09"},"architecture-overview":{"id":"architecture-overview","title":"\u67b6\u6784\u6982\u89c8","description":"\u672c\u6587\u6863\u8fd8\u5728\u6301\u7eed\u66f4\u65b0\u4e2d\uff0c\u4f1a\u4ece\u6982\u5ff5\u4e0a\u4ecb\u7ecd React Native \u65b0\u67b6\u6784\u662f\u5982\u4f55\u5de5\u4f5c\u7684\u3002\u76ee\u6807\u8bfb\u8005\u5305\u62ec\u751f\u6001\u5e93\u7684\u5f00\u53d1\u8005\u3001\u6838\u5fc3\u8d21\u732e\u8005\u548c\u7279\u522b\u6709\u597d\u5947\u5fc3\u7684\u4eba\u3002"},"asyncstorage":{"id":"asyncstorage","title":"\ud83d\udea7 AsyncStorage","description":"\u5df2\u8fc7\u65f6\u3002 Use one of the community packages instead."},"backhandler":{"id":"backhandler","title":"BackHandler","description":"BackHandler API \u7528\u4e8e\u76d1\u542c\u8bbe\u5907\u4e0a\u7684\u540e\u9000\u6309\u94ae\u4e8b\u4ef6\uff0c\u53ef\u4ee5\u8c03\u7528\u4f60\u81ea\u5df1\u7684\u51fd\u6570\u6765\u5904\u7406\u540e\u9000\u884c\u4e3a\u3002\u6b64 API \u4ec5\u80fd\u5728 Android \u4e0a\u4f7f\u7528\u3002","sidebar":"api"},"build-speed":{"id":"build-speed","title":"\u4f18\u5316\u7f16\u8bd1\u901f\u5ea6","description":"\u6784\u5efa React Native \u5e94\u7528\u53ef\u80fd\u4f1a\u975e\u5e38\u6602\u8d35\uff0c\u5e76\u4e14\u9700\u8981\u5f00\u53d1\u4eba\u5458\u82b1\u8d39\u6570\u5206\u949f\u7684\u65f6\u95f4\u3002","sidebar":"docs"},"building-for-tv":{"id":"building-for-tv","title":"\u4e3a\u7535\u89c6\u548c\u673a\u9876\u76d2\u5236\u4f5c\u5e94\u7528","description":"\u76ee\u524d\u7684 React Native \u5e94\u7528\u53ea\u9700\u5728 JavaScript \u7aef\u7b80\u5355\u4fee\u6539\u751a\u81f3\u65e0\u9700\u4fee\u6539\uff0c\u5728\u7535\u89c6\u548c\u673a\u9876\u76d2\u8bbe\u5907\u4e0a\u5c31\u57fa\u672c\u53ef\u7528\u4e86\u3002","sidebar":"docs"},"button":{"id":"button","title":"Button","description":"\u4e00\u4e2a\u7b80\u5355\u7684\u8de8\u5e73\u53f0\u7684\u6309\u94ae\u7ec4\u4ef6\u3002\u53ef\u4ee5\u8fdb\u884c\u4e00\u4e9b\u7b80\u5355\u7684\u5b9a\u5236\u3002","sidebar":"\u7ec4\u4ef6"},"checkbox":{"id":"checkbox","title":"\ud83d\udea7 CheckBox","description":"Removed. Use one of the community packages instead."},"clipboard":{"id":"clipboard","title":"\ud83d\udea7 Clipboard","description":"Deprecated. Use one of the community packages instead."},"colors":{"id":"colors","title":"\u989c\u8272","description":"React Native \u4e2d\u7684\u7ec4\u4ef6\u662f\u4f7f\u7528 JavaScript \u8fdb\u884c\u6837\u5f0f\u5316\u7684\u3002\u989c\u8272\u5c5e\u6027\u901a\u5e38\u4e0e Web \u4e0a\u7684 CSS \u5de5\u4f5c\u65b9\u5f0f\u76f8\u5339\u914d\u3002\u6bcf\u4e2a\u5e73\u53f0\u4e0a\u5173\u4e8e\u989c\u8272\u4f7f\u7528\u7684\u4e00\u822c\u6307\u5357\u5982\u4e0b\uff1a","sidebar":"docs"},"communication-android":{"id":"communication-android","title":"\u548c\u539f\u751f\u7aef\u901a\u4fe1","description":"\u901a\u8fc7\u690d\u5165\u539f\u751f\u5e94\u7528\u548c\u539f\u751f UI \u7ec4\u4ef6\u4e24\u7bc7\u6587\u6863\uff0c\u6211\u4eec\u5b66\u4e60\u4e86 React Native \u548c\u539f\u751f\u7ec4\u4ef6\u7684\u4e92\u76f8\u6574\u5408\u3002\u5728\u6574\u5408\u7684\u8fc7\u7a0b\u4e2d\uff0c\u6211\u4eec\u4f1a\u9700\u8981\u5728\u4e24\u4e2a\u4e16\u754c\u95f4\u4e92\u76f8\u901a\u4fe1\u3002\u6709\u4e9b\u65b9\u6cd5\u5df2\u7ecf\u5728\u5176\u4ed6\u7684\u6307\u5357\u4e2d\u63d0\u5230\u4e86\uff0c\u8fd9\u7bc7\u6587\u7ae0\u603b\u7ed3\u4e86\u6240\u6709\u53ef\u884c\u7684\u6280\u672f\u3002","sidebar":"docs"},"communication-ios":{"id":"communication-ios","title":"\u548c\u539f\u751f\u7aef\u901a\u4fe1","description":"\u901a\u8fc7\u690d\u5165\u539f\u751f\u5e94\u7528\u548c\u539f\u751f UI \u7ec4\u4ef6\u4e24\u7bc7\u6587\u6863\uff0c\u6211\u4eec\u5b66\u4e60\u4e86 React Native \u548c\u539f\u751f\u7ec4\u4ef6\u7684\u4e92\u76f8\u6574\u5408\u3002\u5728\u6574\u5408\u7684\u8fc7\u7a0b\u4e2d\uff0c\u6211\u4eec\u4f1a\u9700\u8981\u5728\u4e24\u4e2a\u4e16\u754c\u95f4\u4e92\u76f8\u901a\u4fe1\u3002\u6709\u4e9b\u65b9\u6cd5\u5df2\u7ecf\u5728\u5176\u4ed6\u7684\u6307\u5357\u4e2d\u63d0\u5230\u4e86\uff0c\u8fd9\u7bc7\u6587\u7ae0\u603b\u7ed3\u4e86\u6240\u6709\u53ef\u884c\u7684\u6280\u672f\u3002","sidebar":"docs"},"components-and-apis":{"id":"components-and-apis","title":"\u6838\u5fc3\u7ec4\u4ef6\u548cAPI","description":"React Native \u63d0\u4f9b\u4e86\u4e00\u4e9b\u5185\u7f6e\u7684\u6838\u5fc3\u7ec4\u4ef6\u4f9b\u4f60\u4f7f\u7528\u3002\u4f60\u53ef\u4ee5\u5728\u7f51\u7ad9\u7684\u5de6\u4fa7\u770b\u5230\u7ec4\u4ef6\u7684\u5b8c\u6574\u5217\u8868\u3002\u5982\u679c\u4f60\u4e0d\u77e5\u9053\u4ece\u54ea\u770b\u8d77\uff0c\u90a3\u4e48\u53ef\u4ee5\u5148\u770b\u4e00\u4e0b\u4e0b\u9762\u8fd9\u4e2a\u7b80\u5355\u7684\u5206\u7c7b\uff1a","sidebar":"\u7ec4\u4ef6"},"custom-webview-android":{"id":"custom-webview-android","title":"Custom WebView","description":"While the built-in web view has a lot of features, it is not possible to handle every use-case in React Native. You can, however, extend the web view with native code without forking React Native or duplicating all the existing web view code."},"custom-webview-ios":{"id":"custom-webview-ios","title":"Custom WebView","description":"While the built-in web view has a lot of features, it is not possible to handle every use-case in React Native. You can, however, extend the web view with native code without forking React Native or duplicating all the existing web view code."},"datepickerandroid":{"id":"datepickerandroid","title":"\ud83d\udea7 DatePickerAndroid","description":"Deprecated. Use one of the community packages instead."},"datepickerios":{"id":"datepickerios","title":"\ud83d\udea7 DatePickerIOS","description":"Deprecated. Use one of the community packages instead."},"debugging":{"id":"debugging","title":"\u8c03\u8bd5","description":"\u8bbf\u95ee App \u5185\u7684\u5f00\u53d1\u83dc\u5355","sidebar":"docs"},"debugging-native-code":{"id":"debugging-native-code","title":"\u8c03\u8bd5\u539f\u751f\u4ee3\u7801","description":"Projects with Native Code Only","sidebar":"docs"},"debugging-release-builds":{"id":"debugging-release-builds","title":"\u8c03\u8bd5\u53d1\u884c\u7248\u672c","description":"\u7b26\u53f7\u5316\u5806\u6808\u8ddf\u8e2a","sidebar":"docs"},"devsettings":{"id":"devsettings","title":"DevSettings","description":"DevSettings \u6a21\u5757\u53ef\u4ee5\u5bf9\u5f00\u53d1\u8005\u83dc\u5355\u8fdb\u884c\u4e00\u4e9b\u81ea\u5b9a\u4e49\u3002","sidebar":"api"},"dimensions":{"id":"dimensions","title":"Dimensions","description":"\u672c\u6a21\u5757\u7528\u4e8e\u83b7\u53d6\u8bbe\u5907\u5c4f\u5e55\u7684\u5bbd\u9ad8\u3002","sidebar":"api"},"drawerlayoutandroid":{"id":"drawerlayoutandroid","title":"DrawerLayoutAndroid","description":"\u5c01\u88c5\u4e86 Android \u5e73\u53f0DrawerLayout\u7684 React \u7ec4\u4ef6\u3002\u62bd\u5c49\uff08\u901a\u5e38\u7528\u4e8e\u5bfc\u822a\u5207\u6362\uff09\u662f\u901a\u8fc7renderNavigationView\u65b9\u6cd5\u6e32\u67d3\u7684\uff0c\u5e76\u4e14 DrawerLayoutAndroid \u7684\u76f4\u63a5\u5b50\u89c6\u56fe\u4f1a\u6210\u4e3a\u4e3b\u89c6\u56fe\uff08\u7528\u4e8e\u653e\u7f6e\u5185\u5bb9\uff09\u3002\u5bfc\u822a\u89c6\u56fe\u4e00\u5f00\u59cb\u5728\u5c4f\u5e55\u4e0a\u5e76\u4e0d\u53ef\u89c1\uff0c\u4e0d\u8fc7\u53ef\u4ee5\u4ecedrawerPosition\u6307\u5b9a\u7684\u7a97\u53e3\u4fa7\u9762\u62d6\u62fd\u51fa\u6765\uff0c\u5e76\u4e14\u62bd\u5c49\u7684\u5bbd\u5ea6\u53ef\u4ee5\u4f7f\u7528drawerWidth\u5c5e\u6027\u6765\u6307\u5b9a\u3002","sidebar":"\u7ec4\u4ef6"},"dynamiccolorios":{"id":"dynamiccolorios","title":"DynamicColorIOS","description":"DynamicColorIOS\u51fd\u6570\u662f\u4e13\u95e8\u9488\u5bf9iOS\u5e73\u53f0\u7684\u989c\u8272\u7c7b\u578b\u3002","sidebar":"api"},"easing":{"id":"easing","title":"Easing","description":"Easing\u6a21\u5757\u5b9e\u73b0\u4e86\u5e38\u89c1\u7684\u52a8\u753b\u7f13\u52a8\u51fd\u6570\u3002 \u8fd9\u4e2a\u6a21\u5757\u88abAnimated.timing()\u7528\u4e8e\u5728\u52a8\u753b\u4e2d\u4f20\u8fbe\u771f\u5b9e\u53ef\u4fe1\u7684\u8fd0\u52a8\u3002","sidebar":"api"},"environment-setup":{"id":"environment-setup","title":"\u642d\u5efa\u5f00\u53d1\u73af\u5883","description":"\u6b22\u8fce\u4f7f\u7528 React Native\uff01\u8fd9\u7bc7\u6587\u6863\u4f1a\u5e2e\u52a9\u4f60\u642d\u5efa\u57fa\u672c\u7684 React Native \u5f00\u53d1\u73af\u5883\u3002","sidebar":"docs"},"fabric-native-components-android":{"id":"fabric-native-components-android","title":"Fabric Native Modules: Android","description":"\u73b0\u5728\uff0c\u662f\u65f6\u5019\u7f16\u5199\u4e00\u4e9b Android \u5e73\u53f0\u4ee3\u7801\uff0c\u4ee5\u4fbf\u80fd\u591f\u6e32\u67d3 web \u89c6\u56fe\u3002\u4ee5\u4e0b\u662f\u9700\u8981\u7684\u6b65\u9aa4\uff1a"},"fabric-native-components-introduction":{"id":"fabric-native-components-introduction","title":"Fabric Native Components Introduction","description":"\u5982\u679c\u4f60\u60f3\u6784\u5efa\u4e00\u4e2a \u65b0\u67b6\u6784 \u7684 React Native \u7ec4\u4ef6\uff0c\u8be5\u7ec4\u4ef6\u53ef\u4ee5\u5305\u88c5\u4e00\u4e2a Host Component\uff0c\u4f8b\u5982 Android \u4e0a\u7684 CheckBox\uff0c\u6216\u8005 iOS \u4e0a\u7684 UIButton\uff0c\u4f60\u5e94\u8be5\u4f7f\u7528 Fabric \u539f\u751f\u7ec4\u4ef6\u3002","sidebar":"docs"},"fabric-native-components-ios":{"id":"fabric-native-components-ios","title":"Fabric Native Components: iOS","description":"\u73b0\u5728\uff0c\u662f\u65f6\u5019\u7f16\u5199\u4e00\u4e9b iOS \u5e73\u53f0\u4ee3\u7801\uff0c\u4ee5\u4fbf\u80fd\u591f\u6e32\u67d3 web \u89c6\u56fe\u3002\u4ee5\u4e0b\u662f\u9700\u8981\u7684\u6b65\u9aa4\uff1a"},"fabric-renderer":{"id":"fabric-renderer","title":"Fabric \u6e32\u67d3\u5668","description":"Fabric \u662f React Native \u65b0\u67b6\u6784\u7684\u6e32\u67d3\u7cfb\u7edf\uff0c\u662f\u4ece\u8001\u67b6\u6784\u7684\u6e32\u67d3\u7cfb\u7edf\u6f14\u53d8\u800c\u6765\u7684\u3002\u6838\u5fc3\u539f\u7406\u662f\u5728 C++ \u5c42\u7edf\u4e00\u66f4\u591a\u7684\u6e32\u67d3\u903b\u8f91\uff0c\u63d0\u5347\u4e0e\u5bbf\u4e3b\u5e73\u53f0\uff08host platforms\uff09\u4e92\u64cd\u4f5c\u6027\uff0c\u5e76\u4e3a React Native \u89e3\u9501\u66f4\u591a\u80fd\u529b\u3002\u5176\u7814\u53d1\u59cb\u4e8e 2018 \u5e74\u3002\u4ece 2021 \u5e74\u5f00\u59cb\uff0c Facebook App \u4e2d\u7684 React Native \u542f\u7528\u4e86\u65b0\u7684\u6e32\u67d3\u5668\u3002"},"fast-refresh":{"id":"fast-refresh","title":"\u5feb\u901f\u5237\u65b0","description":"\u5feb\u901f\u5237\u65b0\u662f React Native \u4e00\u4e2a\u7279\u6027\uff0c\u5728\u4fee\u6539\u7ec4\u4ef6\u7684\u65f6\u5019\u5feb\u901f\u5237\u65b0\u4f1a\u7ed9\u4f60\u4e00\u4e2a\u5373\u65f6\u7684\u53cd\u9988\u3002\u5feb\u901f\u5237\u65b0\u9ed8\u8ba4\u662f\u5f00\u542f\u7684\uff0c\u53ef\u4ee5\u901a\u8fc7\u8c03\u6574 React Native \u5f00\u53d1\u8005\u83dc\u5355\u91cc\u9762\u7684 \\"Enable Fast Refresh\\" \u6765\u5f00\u542f\u6216\u5173\u95ed\u3002\u5728\u5feb\u901f\u5237\u65b0\u5f00\u542f\u7684\u65f6\u5019\uff0c\u5927\u591a\u6570\u7684\u4fee\u6539\u80fd\u5728\u4e00\u5230\u4e24\u79d2\u4e4b\u5185\u5448\u73b0\u3002","sidebar":"docs"},"flatlist":{"id":"flatlist","title":"FlatList","description":"\u9ad8\u6027\u80fd\u7684\u7b80\u5355\u5217\u8868\u7ec4\u4ef6\uff0c\u652f\u6301\u4e0b\u9762\u8fd9\u4e9b\u5e38\u7528\u7684\u529f\u80fd\uff1a","sidebar":"\u7ec4\u4ef6"},"flexbox":{"id":"flexbox","title":"\u4f7f\u7528 Flexbox \u5e03\u5c40","description":"\u6211\u4eec\u5728 React Native \u4e2d\u4f7f\u7528 flexbox \u89c4\u5219\u6765\u6307\u5b9a\u67d0\u4e2a\u7ec4\u4ef6\u7684\u5b50\u5143\u7d20\u7684\u5e03\u5c40\u3002Flexbox \u53ef\u4ee5\u5728\u4e0d\u540c\u5c4f\u5e55\u5c3a\u5bf8\u4e0a\u63d0\u4f9b\u4e00\u81f4\u7684\u5e03\u5c40\u7ed3\u6784\u3002","sidebar":"docs"},"gesture-responder-system":{"id":"gesture-responder-system","title":"\u624b\u52bf\u54cd\u5e94\u7cfb\u7edf","description":"\u79fb\u52a8\u8bbe\u5907\u4e0a\u7684\u624b\u52bf\u8bc6\u522b\u8981\u6bd4\u5728 web \u4e0a\u590d\u6742\u5f97\u591a\u3002\u7528\u6237\u7684\u4e00\u6b21\u89e6\u6478\u64cd\u4f5c\u7684\u771f\u5b9e\u610f\u56fe\u662f\u4ec0\u4e48\uff0cApp \u8981\u7ecf\u8fc7\u597d\u51e0\u4e2a\u9636\u6bb5\u624d\u80fd\u5224\u65ad\u3002\u6bd4\u5982 App \u9700\u8981\u5224\u65ad\u7528\u6237\u7684\u89e6\u6478\u5230\u5e95\u662f\u5728\u6eda\u52a8\u9875\u9762\uff0c\u8fd8\u662f\u6ed1\u52a8\u4e00\u4e2a widget\uff0c\u6216\u8005\u53ea\u662f\u4e00\u4e2a\u5355\u7eaf\u7684\u70b9\u51fb\u3002\u751a\u81f3\u968f\u7740\u6301\u7eed\u65f6\u95f4\u7684\u4e0d\u540c\uff0c\u8fd9\u4e9b\u64cd\u4f5c\u8fd8\u4f1a\u8f6c\u5316\u3002\u6b64\u5916\uff0c\u8fd8\u6709\u591a\u70b9\u540c\u65f6\u89e6\u63a7\u7684\u60c5\u51b5\u3002","sidebar":"docs"},"getting-started":{"id":"getting-started","title":"\u7b80\u4ecb","description":"\u6b22\u8fce\u5f00\u542f React Native \u7684\u65c5\u7a0b\uff01\u5982\u679c\u4f60\u5728\u627e\u5982\u4f55\u642d\u5efa\u73af\u5883\u7684\u6587\u6863\uff0c\u8bf7\u79fb\u6b65\u642d\u5efa\u5f00\u53d1\u73af\u5883\u3002 \u7ee7\u7eed\u5f80\u4e0b\u9605\u8bfb\u53ef\u4e86\u89e3\u5173\u4e8e\u6587\u6863\u7ed3\u6784\u3001\u539f\u751f\u7ec4\u4ef6\u3001React\u7b49\u76f8\u5173\u7684\u4e00\u4e9b\u4ecb\u7ecd\u3002","sidebar":"docs"},"handling-text-input":{"id":"handling-text-input","title":"\u5904\u7406\u6587\u672c\u8f93\u5165","description":"TextInput\u662f\u4e00\u4e2a\u5141\u8bb8\u7528\u6237\u8f93\u5165\u6587\u672c\u7684\u57fa\u7840\u7ec4\u4ef6\u3002\u5b83\u6709\u4e00\u4e2a\u540d\u4e3aonChangeText\u7684\u5c5e\u6027\uff0c\u6b64\u5c5e\u6027\u63a5\u53d7\u4e00\u4e2a\u51fd\u6570\uff0c\u800c\u6b64\u51fd\u6570\u4f1a\u5728\u6587\u672c\u53d8\u5316\u65f6\u88ab\u8c03\u7528\u3002\u53e6\u5916\u8fd8\u6709\u4e00\u4e2a\u540d\u4e3aonSubmitEditing\u7684\u5c5e\u6027\uff0c\u4f1a\u5728\u6587\u672c\u88ab\u63d0\u4ea4\u540e\uff08\u7528\u6237\u6309\u4e0b\u8f6f\u952e\u76d8\u4e0a\u7684\u63d0\u4ea4\u952e\uff09\u8c03\u7528\u3002","sidebar":"docs"},"handling-touches":{"id":"handling-touches","title":"\u5904\u7406\u89e6\u6478\u4e8b\u4ef6","description":"\u79fb\u52a8\u5e94\u7528\u4e0a\u7684\u7528\u6237\u4ea4\u4e92\u57fa\u672c\u9760\u201c\u6478\u201d\u3002\u5f53\u7136\uff0c\u201c\u6478\u201d\u4e5f\u662f\u6709\u5404\u79cd\u59ff\u52bf\u7684\uff1a\u5728\u4e00\u4e2a\u6309\u94ae\u4e0a\u70b9\u51fb\uff0c\u5728\u4e00\u4e2a\u5217\u8868\u4e0a\u6ed1\u52a8\uff0c\u6216\u662f\u5728\u4e00\u4e2a\u5730\u56fe\u4e0a\u7f29\u653e\u3002React Native \u63d0\u4f9b\u4e86\u53ef\u4ee5\u5904\u7406\u5e38\u89c1\u89e6\u6478\u624b\u52bf\uff08\u4f8b\u5982\u70b9\u51fb\u6216\u6ed1\u52a8\uff09\u7684\u7ec4\u4ef6\uff0c \u4ee5\u53ca\u53ef\u7528\u4e8e\u8bc6\u522b\u66f4\u590d\u6742\u7684\u624b\u52bf\u7684\u5b8c\u6574\u7684\u624b\u52bf\u54cd\u5e94\u7cfb\u7edf\u3002","sidebar":"docs"},"headless-js-android":{"id":"headless-js-android","title":"Headless JS\uff08\u540e\u53f0\u4efb\u52a1\uff09","description":"Headless JS \u662f\u4e00\u79cd\u4f7f\u7528 js \u5728\u540e\u53f0\u6267\u884c\u4efb\u52a1\u7684\u65b9\u6cd5\u3002\u5b83\u53ef\u4ee5\u7528\u6765\u5728\u540e\u53f0\u540c\u6b65\u6570\u636e\u3001\u5904\u7406\u63a8\u9001\u901a\u77e5\u6216\u662f\u64ad\u653e\u97f3\u4e50\u7b49\u7b49\u3002","sidebar":"docs"},"height-and-width":{"id":"height-and-width","title":"\u9ad8\u5ea6\u4e0e\u5bbd\u5ea6","description":"\u7ec4\u4ef6\u7684\u9ad8\u5ea6\u548c\u5bbd\u5ea6\u51b3\u5b9a\u4e86\u5176\u5728\u5c4f\u5e55\u4e0a\u663e\u793a\u7684\u5c3a\u5bf8\u3002","sidebar":"docs"},"hermes":{"id":"hermes","title":"\u4f7f\u7528\u65b0\u7684 Hermes \u5f15\u64ce","description":"Hermes \u662f\u4e13\u95e8\u9488\u5bf9 React Native \u5e94\u7528\u800c\u4f18\u5316\u7684\u5168\u65b0\u5f00\u6e90 JavaScript \u5f15\u64ce\u3002\u5bf9\u4e8e\u5f88\u591a\u5e94\u7528\u6765\u8bf4\uff0c\u542f\u7528 Hermes \u5f15\u64ce\u53ef\u4ee5\u4f18\u5316\u542f\u52a8\u65f6\u95f4\uff0c\u51cf\u5c11\u5185\u5b58\u5360\u7528\u4ee5\u53ca\u7a7a\u95f4\u5360\u7528\u3002\u4ece React Native 0.70 \u7248\u672c\u5f00\u59cb Hermes \u5df2\u7ecf\u9ed8\u8ba4\u542f\u7528\uff0c\u65e0\u9700\u5f00\u53d1\u8005\u518d\u505a\u4efb\u4f55\u914d\u7f6e\u3002","sidebar":"docs"},"image":{"id":"image","title":"Image","description":"\u7528\u4e8e\u663e\u793a\u591a\u79cd\u4e0d\u540c\u7c7b\u578b\u56fe\u7247\u7684 React \u7ec4\u4ef6\uff0c\u5305\u62ec\u7f51\u7edc\u56fe\u7247\u3001\u9759\u6001\u8d44\u6e90\u3001\u4e34\u65f6\u7684\u672c\u5730\u56fe\u7247\u3001\u4ee5\u53ca\u672c\u5730\u78c1\u76d8\u4e0a\u7684\u56fe\u7247\uff08\u5982\u76f8\u518c\uff09\u7b49\u3002","sidebar":"\u7ec4\u4ef6"},"image-style-props":{"id":"image-style-props","title":"\u56fe\u7247\u6837\u5f0f\u5c5e\u6027","description":"\u793a\u4f8b","sidebar":"\u7ec4\u4ef6"},"imagebackground":{"id":"imagebackground","title":"ImageBackground","description":"\u5bf9\u4e8e\u719f\u6089 Web \u5f00\u53d1\u7684\u5f00\u53d1\u4eba\u5458\u6765\u8bf4\uff0cbackground-image\u662f\u4e00\u4e2a\u5e38\u89c1\u7684\u529f\u80fd\u8bf7\u6c42\u3002\u4e3a\u4e86\u5904\u7406\u8fd9\u79cd\u60c5\u51b5\uff0c\u60a8\u53ef\u4ee5\u4f7f\u7528`\u7ec4\u4ef6\uff0c\u5b83\u5177\u6709\u4e0e`\u76f8\u540c\u7684\u5c5e\u6027\uff0c\u5e76\u4e14\u53ef\u4ee5\u6dfb\u52a0\u4efb\u4f55\u5b50\u5143\u7d20\u4ee5\u8986\u76d6\u5728\u5176\u4e0a\u9762\u3002","sidebar":"\u7ec4\u4ef6"},"imagepickerios":{"id":"imagepickerios","title":"\ud83d\udea7 ImagePickerIOS","description":"Deprecated. Use one of the community packages instead."},"images":{"id":"images","title":"\u56fe\u7247","description":"\u9759\u6001\u56fe\u7247\u8d44\u6e90","sidebar":"docs"},"improvingux":{"id":"improvingux","title":"\u6539\u8fdb\u7528\u6237\u4f53\u9a8c","description":"\u914d\u7f6e\u6587\u672c\u8f93\u5165"},"inputaccessoryview":{"id":"inputaccessoryview","title":"InputAccessoryView","description":"\u4e00\u4e2a\u53ef\u4ee5\u5728iOS\u4e0a\u81ea\u5b9a\u4e49\u952e\u76d8\u8f93\u5165\u8f85\u52a9\u89c6\u56fe\u7684\u7ec4\u4ef6\u3002\u5f53TextInput\u83b7\u5f97\u7126\u70b9\u65f6\uff0c\u8f93\u5165\u8f85\u52a9\u89c6\u56fe\u663e\u793a\u5728\u952e\u76d8\u4e0a\u65b9\u3002\u8be5\u7ec4\u4ef6\u53ef\u7528\u4e8e\u521b\u5efa\u81ea\u5b9a\u4e49\u5de5\u5177\u680f\u3002","sidebar":"\u7ec4\u4ef6"},"integration-with-android-fragment":{"id":"integration-with-android-fragment","title":"\u96c6\u6210\u5230 Android Fragment","description":"\u4e0e\u73b0\u6709\u5e94\u7528\u7a0b\u5e8f\u96c6\u6210\u6307\u5357\u4e2d\u8be6\u7ec6\u4ecb\u7ecd\u4e86\u5982\u4f55\u5c06\u5168\u5c4f React Native \u5e94\u7528\u7a0b\u5e8f\u4f5c\u4e3a Activity \u96c6\u6210\u5230\u73b0\u6709 Android \u5e94\u7528\u7a0b\u5e8f\u4e2d\u3002\u8981\u5728\u73b0\u6709\u5e94\u7528\u7a0b\u5e8f\u7684 Fragments \u4e2d\u4f7f\u7528 React Native \u7ec4\u4ef6\uff0c\u9700\u8981\u8fdb\u884c\u4e00\u4e9b\u989d\u5916\u7684\u8bbe\u7f6e\u3002\u8fd9\u6837\u505a\u7684\u597d\u5904\u662f\u5b83\u5141\u8bb8\u539f\u751f\u5e94\u7528\u7a0b\u5e8f\u5c06 React Native \u7ec4\u4ef6\u4e0e Activity \u4e2d\u7684\u539f\u751f Fragments \u96c6\u6210\u5728\u4e00\u8d77\u3002","sidebar":"docs"},"integration-with-existing-apps":{"id":"integration-with-existing-apps","title":"\u96c6\u6210\u5230\u73b0\u6709\u539f\u751f\u5e94\u7528","description":"\u5982\u679c\u4f60\u6b63\u51c6\u5907\u4ece\u5934\u5f00\u59cb\u5236\u4f5c\u4e00\u4e2a\u65b0\u7684\u5e94\u7528\uff0c\u90a3\u4e48 React Native \u4f1a\u662f\u4e2a\u975e\u5e38\u597d\u7684\u9009\u62e9\u3002\u4f46\u5982\u679c\u4f60\u53ea\u60f3\u7ed9\u73b0\u6709\u7684\u539f\u751f\u5e94\u7528\u4e2d\u6dfb\u52a0\u4e00\u4e24\u4e2a\u89c6\u56fe\u6216\u662f\u4e1a\u52a1\u6d41\u7a0b\uff0cReact Native \u4e5f\u540c\u6837\u4e0d\u5728\u8bdd\u4e0b\u3002\u53ea\u9700\u7b80\u5355\u51e0\u6b65\uff0c\u4f60\u5c31\u53ef\u4ee5\u7ed9\u539f\u6709\u5e94\u7528\u52a0\u4e0a\u65b0\u7684\u57fa\u4e8e React Native \u7684\u7279\u6027\u3001\u753b\u9762\u548c\u89c6\u56fe\u7b49\u3002","sidebar":"docs"},"interactionmanager":{"id":"interactionmanager","title":"InteractionManager","description":"Interactionmanager \u53ef\u4ee5\u5c06\u4e00\u4e9b\u8017\u65f6\u8f83\u957f\u7684\u5de5\u4f5c\u5b89\u6392\u5230\u6240\u6709\u4e92\u52a8\u6216\u52a8\u753b\u5b8c\u6210\u4e4b\u540e\u518d\u8fdb\u884c\u3002\u8fd9\u6837\u53ef\u4ee5\u4fdd\u8bc1 JavaScript \u52a8\u753b\u7684\u6d41\u7545\u8fd0\u884c\u3002","sidebar":"api"},"intro-react":{"id":"intro-react","title":"React \u57fa\u7840","description":"\u8981\u6df1\u5165\u7406\u89e3 React Native\uff0c\u9700\u8981\u624e\u5b9e\u7684React \u57fa\u7840\u77e5\u8bc6\u3002\u8fd9\u7bc7\u5c0f\u6559\u7a0b\u53ef\u4ee5\u5e2e\u52a9\u4f60\u5165\u95e8\u6216\u8005\u6e29\u4e60\u76f8\u5173\u77e5\u8bc6\u3002","sidebar":"docs"},"intro-react-native-components":{"id":"intro-react-native-components","title":"\u6838\u5fc3\u7ec4\u4ef6\u4e0e\u539f\u751f\u7ec4\u4ef6","description":"React Native \u4f7f\u7528\u5b8c\u5168\u539f\u751f\u7684\u7ec4\u4ef6\u6765\u6784\u5efa\u5e94\u7528\u754c\u9762\u3002\u5c24\u5176\u65b9\u4fbf\u7684\u662f\u5b83\u5df2\u7ecf\u5185\u7f6e\u4e86\u5927\u91cf\u76f4\u63a5\u4e0a\u624b\u53ef\u7528\u7684\u6838\u5fc3\u7ec4\u4ef6\u3002","sidebar":"docs"},"javascript-environment":{"id":"javascript-environment","title":"JavaScript \u73af\u5883","description":"JavaScript \u8fd0\u884c\u65f6\u73af\u5883","sidebar":"docs"},"keyboard":{"id":"keyboard","title":"Keyboard","description":"Keyboard\u6a21\u5757\u7528\u6765\u63a7\u5236\u952e\u76d8\u76f8\u5173\u7684\u4e8b\u4ef6\u3002","sidebar":"api"},"keyboardavoidingview":{"id":"keyboardavoidingview","title":"KeyboardAvoidingView","description":"\u672c\u7ec4\u4ef6\u7528\u4e8e\u89e3\u51b3\u4e00\u4e2a\u5e38\u89c1\u7684\u5c34\u5c2c\u95ee\u9898\uff1a\u624b\u673a\u4e0a\u5f39\u51fa\u7684\u952e\u76d8\u5e38\u5e38\u4f1a\u6321\u4f4f\u5f53\u524d\u7684\u89c6\u56fe\u3002\u672c\u7ec4\u4ef6\u53ef\u4ee5\u81ea\u52a8\u6839\u636e\u952e\u76d8\u7684\u9ad8\u5ea6\uff0c\u8c03\u6574\u81ea\u8eab\u7684 height \u6216\u5e95\u90e8\u7684 padding\uff0c\u4ee5\u907f\u514d\u88ab\u906e\u6321\u3002","sidebar":"\u7ec4\u4ef6"},"layout-props":{"id":"layout-props","title":"\u5e03\u5c40\u5c5e\u6027","description":"\u66f4\u591a\u5173\u4e8e\u8fd9\u4e9b\u5c5e\u6027\u7684\u8be6\u7ec6\u793a\u4f8b\u53ef\u4ee5\u5728Flexbox \u5e03\u5c40\u9875\u9762\u4e0a\u627e\u5230\u3002","sidebar":"\u7ec4\u4ef6"},"layoutanimation":{"id":"layoutanimation","title":"LayoutAnimation","description":"\u5f53\u5e03\u5c40\u53d8\u5316\u65f6\uff0c\u81ea\u52a8\u5c06\u89c6\u56fe\u8fd0\u52a8\u5230\u5b83\u4eec\u65b0\u7684\u4f4d\u7f6e\u4e0a\u3002","sidebar":"api"},"layoutevent":{"id":"layoutevent","title":"\u5e03\u5c40\u4e8b\u4ef6\u5bf9\u8c61","description":"LayoutEvent object is returned in the callback as a result of component layout change, for example onLayout in View component.","sidebar":"\u7ec4\u4ef6"},"legacy/direct-manipulation":{"id":"legacy/direct-manipulation","title":"\u76f4\u63a5\u64cd\u4f5c","description":"\u6709\u65f6\u5019\u6211\u4eec\u9700\u8981\u76f4\u63a5\u6539\u52a8\u7ec4\u4ef6\u5e76\u89e6\u53d1\u5c40\u90e8\u7684\u5237\u65b0\uff0c\u4f46\u4e0d\u4f7f\u7528 state \u6216\u662f props\u3002\u8b6c\u5982\u5728\u6d4f\u89c8\u5668\u4e2d\u4f7f\u7528 React \u5e93\uff0c\u6709\u65f6\u5019\u4f1a\u9700\u8981\u76f4\u63a5\u4fee\u6539\u4e00\u4e2a DOM \u8282\u70b9\uff0c\u800c\u5728\u624b\u673a App \u4e2d\u64cd\u4f5c View \u65f6\u4e5f\u4f1a\u78b0\u5230\u540c\u6837\u7684\u60c5\u51b5\u3002\u5728 React Native \u4e2d\uff0csetNativeProps\u5c31\u662f\u7b49\u4ef7\u4e8e\u76f4\u63a5\u64cd\u4f5c DOM \u8282\u70b9\u7684\u65b9\u6cd5\u3002","sidebar":"docs"},"legacy/local-library-setup":{"id":"legacy/local-library-setup","title":"Local libraries setup","description":"A local library is a library containing views or modules that\'s local to your app and not published to a registry. This is different from the traditional setup for view and modules in the sense that a local library is decoupled from your app\'s native code.","sidebar":"docs"},"legacy/native-components-android":{"id":"legacy/native-components-android","title":"Android \u539f\u751fUI\u7ec4\u4ef6","description":"\u5728\u5982\u4eca\u7684 App \u4e2d\uff0c\u5df2\u7ecf\u6709\u6210\u5343\u4e0a\u4e07\u7684\u539f\u751f UI \u90e8\u4ef6\u4e86\u2014\u2014\u5176\u4e2d\u7684\u4e00\u4e9b\u662f\u5e73\u53f0\u7684\u4e00\u90e8\u5206\uff0c\u53e6\u4e00\u4e9b\u53ef\u80fd\u6765\u81ea\u4e8e\u4e00\u4e9b\u7b2c\u4e09\u65b9\u5e93\uff0c\u800c\u4e14\u53ef\u80fd\u4f60\u81ea\u5df1\u8fd8\u6536\u85cf\u4e86\u5f88\u591a\u3002React Native \u5df2\u7ecf\u5c01\u88c5\u4e86\u5927\u90e8\u5206\u6700\u5e38\u89c1\u7684\u7ec4\u4ef6\uff0c\u8b6c\u5982ScrollView\u548cTextInput\uff0c\u4f46\u4e0d\u53ef\u80fd\u5c01\u88c5\u5168\u90e8\u7ec4\u4ef6\u3002\u800c\u4e14\uff0c\u8bf4\u4e0d\u5b9a\u4f60\u66fe\u7ecf\u4e3a\u81ea\u5df1\u4ee5\u524d\u7684 App \u8fd8\u5c01\u88c5\u8fc7\u4e00\u4e9b\u7ec4\u4ef6\uff0cReact Native \u80af\u5b9a\u6ca1\u6cd5\u5305\u542b\u5b83\u4eec\u3002\u5e78\u8fd0\u7684\u662f\uff0c\u5728 React Naitve \u5e94\u7528\u7a0b\u5e8f\u4e2d\u5c01\u88c5\u548c\u690d\u5165\u5df2\u6709\u7684\u7ec4\u4ef6\u975e\u5e38\u7b80\u5355\u3002","sidebar":"docs"},"legacy/native-components-ios":{"id":"legacy/native-components-ios","title":"iOS \u539f\u751fUI\u7ec4\u4ef6","description":"\u5728\u5982\u4eca\u7684 App \u4e2d\uff0c\u5df2\u7ecf\u6709\u6210\u5343\u4e0a\u4e07\u7684\u539f\u751f UI \u90e8\u4ef6\u4e86\u2014\u2014\u5176\u4e2d\u7684\u4e00\u4e9b\u662f\u5e73\u53f0\u7684\u4e00\u90e8\u5206\uff0c\u53e6\u4e00\u4e9b\u53ef\u80fd\u6765\u81ea\u4e8e\u4e00\u4e9b\u7b2c\u4e09\u65b9\u5e93\uff0c\u800c\u4e14\u53ef\u80fd\u4f60\u81ea\u5df1\u8fd8\u6536\u85cf\u4e86\u5f88\u591a\u3002React Native \u5df2\u7ecf\u5c01\u88c5\u4e86\u5927\u90e8\u5206\u6700\u5e38\u89c1\u7684\u7ec4\u4ef6\uff0c\u8b6c\u5982ScrollView\u548cTextInput\uff0c\u4f46\u4e0d\u53ef\u80fd\u5c01\u88c5\u5168\u90e8\u7ec4\u4ef6\u3002\u800c\u4e14\uff0c\u8bf4\u4e0d\u5b9a\u4f60\u66fe\u7ecf\u4e3a\u81ea\u5df1\u4ee5\u524d\u7684 App \u8fd8\u5c01\u88c5\u8fc7\u4e00\u4e9b\u7ec4\u4ef6\uff0cReact Native \u80af\u5b9a\u6ca1\u6cd5\u5305\u542b\u5b83\u4eec\u3002\u5e78\u8fd0\u7684\u662f\uff0c\u5728 React Naitve \u5e94\u7528\u7a0b\u5e8f\u4e2d\u5c01\u88c5\u548c\u690d\u5165\u5df2\u6709\u7684\u7ec4\u4ef6\u975e\u5e38\u7b80\u5355\u3002","sidebar":"docs"},"legacy/native-modules-android":{"id":"legacy/native-modules-android","title":"Android \u539f\u751f\u6a21\u5757","description":"\u6b22\u8fce\u6765\u5230 Android \u7684\u539f\u751f\u6a21\u5757\u3002\u8bf7\u5148\u9605\u8bfb \u539f\u751f\u6a21\u5757\u7b80\u4ecb \u4ee5\u4e86\u89e3\u539f\u751f\u6a21\u5757\u7684\u57fa\u672c\u6982\u5ff5\u3002","sidebar":"docs"},"legacy/native-modules-intro":{"id":"legacy/native-modules-intro","title":"\u539f\u751f\u6a21\u5757\u7b80\u4ecb","description":"\u6709\u65f6\u5019 App \u9700\u8981\u8bbf\u95ee\u5e73\u53f0 API\uff0c\u4f46 React Native \u53ef\u80fd\u8fd8\u6ca1\u6709\u76f8\u5e94\u7684\u6a21\u5757\u5305\u88c5\uff1b\u6216\u8005\u4f60\u9700\u8981\u590d\u7528\u4e00\u4e9b Java \u4ee3\u7801\uff0c\u800c\u4e0d\u662f\u7528 Javascript \u91cd\u65b0\u5b9e\u73b0\u4e00\u904d\uff1b\u53c8\u6216\u8005\u4f60\u9700\u8981\u5b9e\u73b0\u67d0\u4e9b\u9ad8\u6027\u80fd\u7684\u3001\u591a\u7ebf\u7a0b\u7684\u4ee3\u7801\uff0c\u8b6c\u5982\u56fe\u7247\u5904\u7406\u3001\u6570\u636e\u5e93\u3001\u6216\u8005\u5404\u79cd\u9ad8\u7ea7\u6269\u5c55\u7b49\u7b49\u3002","sidebar":"docs"},"legacy/native-modules-ios":{"id":"legacy/native-modules-ios","title":"iOS \u539f\u751f\u6a21\u5757","description":"\u6709\u65f6\u5019 App \u9700\u8981\u8bbf\u95ee\u5e73\u53f0 API\uff0c\u4f46 React Native \u53ef\u80fd\u8fd8\u6ca1\u6709\u76f8\u5e94\u7684\u6a21\u5757\u5c01\u88c5\uff1b\u6216\u8005\u4f60\u9700\u8981\u590d\u7528 Objective-C\u3001Swift \u6216 C++\u4ee3\u7801\uff0c\u800c\u4e0d\u662f\u7528 JavaScript \u91cd\u65b0\u5b9e\u73b0\u4e00\u904d\uff1b\u53c8\u6216\u8005\u4f60\u9700\u8981\u5b9e\u73b0\u67d0\u4e9b\u9ad8\u6027\u80fd\u3001\u591a\u7ebf\u7a0b\u7684\u4ee3\u7801\uff0c\u8b6c\u5982\u56fe\u7247\u5904\u7406\u3001\u6570\u636e\u5e93\u3001\u6216\u8005\u5404\u79cd\u9ad8\u7ea7\u6269\u5c55\u7b49\u7b49\u3002","sidebar":"docs"},"legacy/native-modules-setup":{"id":"legacy/native-modules-setup","title":"Native Modules NPM Package Setup","description":"Native modules are usually distributed as npm packages, except that on top of the usual JavaScript they will include some native code per platform. To understand more about npm packages you may find this guide useful.","sidebar":"docs"},"libraries":{"id":"libraries","title":"\u4f7f\u7528\u7b2c\u4e09\u65b9\u5e93","description":"This guide introduces React Native developers to finding, installing, and using third-party libraries in their apps.","sidebar":"docs"},"linking":{"id":"linking","title":"Linking","description":"Linking\u63d0\u4f9b\u4e86\u4e00\u4e2a\u901a\u7528\u7684\u63a5\u53e3\u6765\u4e0e\u4f20\u5165\u548c\u4f20\u51fa\u7684 App \u94fe\u63a5\u8fdb\u884c\u4ea4\u4e92\u3002","sidebar":"api"},"linking-libraries-ios":{"id":"linking-libraries-ios","title":"\u94fe\u63a5\u539f\u751f\u5e93","description":"\u5e76\u4e0d\u662f\u6240\u6709\u7684 APP \u90fd\u9700\u8981\u4f7f\u7528\u5168\u90e8\u7684\u539f\u751f\u529f\u80fd\uff0c\u5305\u542b\u652f\u6301\u5168\u90e8\u7279\u6027\u7684\u4ee3\u7801\u4f1a\u589e\u5927\u5e94\u7528\u7684\u4f53\u79ef\u3002\u4f46\u6211\u4eec\u4ecd\u7136\u5e0c\u671b\u80fd\u8ba9\u4f60\u7b80\u5355\u5730\u6839\u636e\u81ea\u5df1\u7684\u9700\u6c42\u6dfb\u52a0\u9700\u8981\u7684\u7279\u6027\u3002","sidebar":"docs"},"metro":{"id":"metro","title":"Metro","description":"React Native \u4f7f\u7528Metro\u6784\u5efa JavaScript \u4ee3\u7801\u548c\u8d44\u6e90\u3002","sidebar":"docs"},"modal":{"id":"modal","title":"Modal","description":"Modal \u7ec4\u4ef6\u662f\u4e00\u79cd\u7b80\u5355\u7684\u8986\u76d6\u5728\u5176\u4ed6\u89c6\u56fe\u4e4b\u4e0a\u663e\u793a\u5185\u5bb9\u7684\u65b9\u5f0f\u3002","sidebar":"\u7ec4\u4ef6"},"more-resources":{"id":"more-resources","title":"\u5176\u4ed6\u53c2\u8003\u8d44\u6e90","description":"\u5982\u679c\u4f60\u8010\u5fc3\u7684\u8bfb\u5b8c\u5e76\u7406\u89e3\u4e86\u672c\u7f51\u7ad9\u4e0a\u7684\u6240\u6709\u6587\u6863\uff0c\u90a3\u4e48\u4f60\u5e94\u8be5\u5df2\u7ecf\u53ef\u4ee5\u7f16\u5199\u4e00\u4e2a\u50cf\u6837\u7684 React Native \u5e94\u7528\u4e86\u3002\u4f46\u662f React Native \u5e76\u4e0d\u5168\u662f\u67d0\u4e00\u5bb6\u516c\u53f8\u7684\u4f5c\u54c1\u2014\u2014\u5b83\u6c47\u805a\u4e86\u6210\u5343\u4e0a\u4e07\u5f00\u6e90\u793e\u533a\u5f00\u53d1\u8005\u7684\u667a\u6167\u7ed3\u6676\u3002\u5982\u679c\u4f60\u60f3\u6df1\u5165\u7814\u7a76 React Native\uff0c\u90a3\u4e48\u5efa\u8bae\u4e0d\u8981\u9519\u8fc7\u4e0b\u9762\u8fd9\u4e9b\u53c2\u8003\u8d44\u6e90\u3002","sidebar":"docs"},"native-platform":{"id":"native-platform","title":"\u6865\u63a5\u539f\u751f\u5e73\u53f0\u80fd\u529b","description":"\u4f60\u7684\u5e94\u7528\u53ef\u80fd\u9700\u8981\u8bbf\u95ee React Native \u6216\u793e\u533a\u7ef4\u62a4\u7684\u6570\u767e\u4e2a \u7b2c\u4e09\u65b9\u5e93 \u4e2d\u672a\u76f4\u63a5\u63d0\u4f9b\u7684\u5e73\u53f0\u529f\u80fd\u3002\u4e5f\u8bb8\u4f60\u60f3\u8981\u91cd\u7528\u4e00\u4e9b\u73b0\u6709\u7684 Objective-C\u3001Swift\u3001Java\u3001Kotlin \u6216 C++ \u4ee3\u7801\u3002\u65e0\u8bba\u4f60\u7684\u539f\u56e0\u662f\u4ec0\u4e48\uff0cReact Native \u90fd\u63d0\u4f9b\u4e86\u4e00\u7ec4\u5f3a\u5927\u7684 API \u6765\u8fde\u63a5\u4f60\u7684\u539f\u751f\u4ee3\u7801\u548c JavaScript \u5e94\u7528\u4ee3\u7801\u3002","sidebar":"docs"},"navigation":{"id":"navigation","title":"\u4f7f\u7528\u5bfc\u822a\u5668\u8df3\u8f6c\u9875\u9762","description":"\u79fb\u52a8\u5e94\u7528\u57fa\u672c\u4e0d\u4f1a\u53ea\u7531\u4e00\u4e2a\u9875\u9762\u7ec4\u6210\u3002\u7ba1\u7406\u591a\u4e2a\u9875\u9762\u7684\u5448\u73b0\u3001\u8df3\u8f6c\u7684\u7ec4\u4ef6\u5c31\u662f\u6211\u4eec\u901a\u5e38\u6240\u8bf4\u7684\u5bfc\u822a\u5668\uff08navigator\uff09\u3002","sidebar":"docs"},"netinfo":{"id":"netinfo","title":"NetInfo","description":"\u5df2\u8fc7\u65f6\u3002 Use react-native-community/react-native-netinfo instead."},"network":{"id":"network","title":"\u8bbf\u95ee\u7f51\u7edc","description":"\u5f88\u591a\u79fb\u52a8\u5e94\u7528\u90fd\u9700\u8981\u4ece\u8fdc\u7a0b\u5730\u5740\u4e2d\u83b7\u53d6\u6570\u636e\u6216\u8d44\u6e90\u3002\u4f60\u53ef\u80fd\u9700\u8981\u7ed9\u67d0\u4e2a REST API \u53d1\u8d77 POST \u8bf7\u6c42\u4ee5\u63d0\u4ea4\u7528\u6237\u6570\u636e\uff0c\u53c8\u6216\u8005\u53ef\u80fd\u4ec5\u4ec5\u9700\u8981\u4ece\u67d0\u4e2a\u670d\u52a1\u5668\u4e0a\u83b7\u53d6\u4e00\u4e9b\u9759\u6001\u5185\u5bb9\u2014\u2014\u4ee5\u4e0b\u5c31\u662f\u4f60\u4f1a\u7528\u5230\u7684\u4e1c\u897f\u3002\u65b0\u624b\u53ef\u4ee5\u5bf9\u7167\u8fd9\u4e2a\u7b80\u77ed\u7684\u89c6\u9891\u6559\u7a0b\u52a0\u6df1\u7406\u89e3\u3002","sidebar":"docs"},"new-architecture-app-intro":{"id":"new-architecture-app-intro","title":"\u5728\u5e94\u7528\u4e2d\u542f\u7528\u7684\u9884\u5907\u5de5\u4f5c","description":"\u5728\u542f\u7528\u65b0\u67b6\u6784\u4e4b\u524d\uff0c\u5e94\u5148\u6ee1\u8db3\u4e00\u4e9b\u5148\u51b3\u6761\u4ef6\u3002"},"new-architecture-app-modules-ios":{"id":"new-architecture-app-modules-ios","title":"\u5728 iOS \u4e0a\u542f\u7528 TurboModule","description":"Make sure your application meets all the prerequisites."},"new-architecture-app-renderer-android":{"id":"new-architecture-app-renderer-android","title":"\u5728 Android \u4e0a\u542f\u7528 Fabric","description":"Make sure your application meets all the prerequisites."},"new-architecture-app-renderer-ios":{"id":"new-architecture-app-renderer-ios","title":"\u5728 iOS \u4e0a\u542f\u7528 Fabric","description":"This section will go over how to enable the new renderer in your app. Make sure your application meets all the prerequisites."},"new-architecture-intro":{"id":"new-architecture-intro","title":"\u8fc1\u79fb\u5230\u65b0\u67b6\u6784","description":"\u6b64\u8fc1\u79fb\u6307\u5357\u65e8\u5728\u4e3aReact Native\u7684\u5e93\u4f5c\u8005\u548c\u5e94\u7528\u7a0b\u5e8f\u5f00\u53d1\u8005\u63d0\u4f9b\u3002\u5b83\u6982\u8ff0\u4e86\u60a8\u9700\u8981\u9075\u5faa\u7684\u6b65\u9aa4\uff0c\u4ee5\u5728\u60a8\u7684Android\u548ciOS\u5e93\u548c\u5e94\u7528\u4e2d\u4f7f\u7528\u7531\u65b0\u7684NativeModule\u7cfb\u7edf\uff08TurboModule\uff09\u548c\u65b0\u7684\u6e32\u67d3\u5668\uff08Fabric\uff09\u7ec4\u6210\u7684\u65b0\u67b6\u6784\u3002"},"new-architecture-library-android":{"id":"new-architecture-library-android","title":"\u5728 Android \u5e93\u4e2d\u542f\u7528","description":"\u4e00\u65e6\u60a8\u5728\u5148\u51b3\u6761\u4ef6\u4e2d\u5b9a\u4e49\u4e86\u672c\u673a\u6a21\u5757\u7684 JavaScript \u89c4\u8303\uff0c\u8bbe\u7f6e\u4e86 CodeGen \u914d\u7f6e\uff0c\u5e76\u9075\u5faa\u4e86 Android/Gradle \u8bbe\u7f6e\uff0c\u7136\u540e\u5c31\u53ef\u4ee5\u5c06\u60a8\u7684\u5e93\u8fc1\u79fb\u5230\u65b0\u67b6\u6784\u3002\u4ee5\u4e0b\u662f\u8fc1\u79fb\u6240\u9700\u7684\u6b65\u9aa4\u3002"},"new-architecture-library-intro":{"id":"new-architecture-library-intro","title":"\u5728\u5e93\u4e2d\u542f\u7528\u7684\u9884\u5907\u5de5\u4f5c","description":"The following steps will help ensure your modules and components are ready for the New Architecture."},"new-architecture-library-ios":{"id":"new-architecture-library-ios","title":"\u5728 iOS \u5e93\u4e2d\u542f\u7528","description":"You have defined the JavaScript specs for your native modules as part of the prerequisites, and you are now ready to migrate your library to the New Architecture. Here are the steps you can follow to accomplish this."},"new-architecture-troubleshooting":{"id":"new-architecture-troubleshooting","title":"\u5e38\u89c1\u95ee\u9898","description":"\u672c\u9875\u9762\u4f1a\u8bb0\u5f55\u4e00\u4e9b\u8fc1\u79fb\u5230\u65b0\u67b6\u6784\u65f6\u53ef\u80fd\u9047\u5230\u7684\u5e38\u89c1\u95ee\u9898\u7684\u89e3\u51b3\u65b9\u6848\u3002"},"new-architecture-turbo-modules":{"id":"new-architecture-turbo-modules","title":"\u65b0\u67b6\u6784\u7684\u539f\u751f\u6a21\u5757\uff08Turbo Module\uff09","description":"If you\'ve worked with React Native, you may be familiar with the concept of Native Modules, which allow JavaScript and platform-native code to communicate over the React Native \\"bridge\\", which handles cross-platform serialization via JSON."},"optimizing-flatlist-configuration":{"id":"optimizing-flatlist-configuration","title":"\u5217\u8868\u914d\u7f6e\u4f18\u5316","description":"\u672f\u8bed\u5b9a\u4e49","sidebar":"docs"},"optimizing-javascript-loading":{"id":"optimizing-javascript-loading","title":"Optimizing JavaScript loading","description":"\u89e3\u6790\u548c\u8fd0\u884c JavaScript \u4ee3\u7801\u9700\u8981\u5185\u5b58\u548c\u65f6\u95f4\u3002\u56e0\u6b64\uff0c\u968f\u7740\u4f60\u7684\u5e94\u7528\u7a0b\u5e8f\u589e\u957f\uff0c\u901a\u5e38\u5c06\u4ee3\u7801\u52a0\u8f7d\u5ef6\u8fdf\u5230\u9996\u6b21\u9700\u8981\u65f6\u662f\u6709\u7528\u7684\u3002React Native \u81ea\u5e26\u4e00\u4e9b\u9ed8\u8ba4\u5f00\u542f\u7684\u6807\u51c6\u4f18\u5316\uff0c\u5e76\u4e14\u4f60\u53ef\u4ee5\u5728\u81ea\u5df1\u7684\u4ee3\u7801\u4e2d\u91c7\u7528\u4e00\u4e9b\u6280\u672f\u6765\u5e2e\u52a9 React \u66f4\u6709\u6548\u5730\u52a0\u8f7d\u4f60\u7684\u5e94\u7528\u7a0b\u5e8f\u3002\u8fd8\u6709\u4e00\u4e9b\u9002\u5408\u975e\u5e38\u5927\u5e94\u7528\u7a0b\u5e8f\u7684\u9ad8\u7ea7\u81ea\u52a8\u4f18\u5316\uff08\u5b83\u4eec\u4e5f\u6709\u81ea\u5df1\u7684\u6743\u8861\uff09\u3002","sidebar":"docs"},"other-debugging-methods":{"id":"other-debugging-methods","title":"\u5176\u4ed6\u8c03\u8bd5\u65b9\u6cd5","description":"\u6b64\u9875\u9762\u4ecb\u7ecd\u4e86\u9664 \u6253\u5f00\u8c03\u8bd5\u5668 \u4e2d\u63cf\u8ff0\u7684\u65b9\u6cd5\u4e4b\u5916\u7684\u5176\u4ed6 JavaScript \u8c03\u8bd5\u65b9\u6cd5\u3002\u5982\u679c\u4f60\u6b63\u5728\u4f7f\u7528\u65b0\u521b\u5efa\u7684 React Native \u6216 Expo \u5e94\u7528\uff0c\u6211\u4eec\u5efa\u8bae\u4ece\u90a3\u91cc\u5f00\u59cb\u3002","sidebar":"docs"},"out-of-tree-platforms":{"id":"out-of-tree-platforms","title":"\u591a\u5e73\u53f0\u652f\u6301","description":"React Native\u4e0d\u4ec5\u9002\u7528\u4e8e Android \u548c iOS - \u8fd8\u6709\u793e\u533a\u652f\u6301\u7684\u9879\u76ee\u5c06\u5176\u5e94\u7528\u4e8e\u5176\u4ed6\u5e73\u53f0\uff0c\u4f8b\u5982\uff1a","sidebar":"docs"},"panresponder":{"id":"panresponder","title":"PanResponder","description":"PanResponder\u7c7b\u53ef\u4ee5\u5c06\u591a\u70b9\u89e6\u6478\u64cd\u4f5c\u534f\u8c03\u6210\u4e00\u4e2a\u624b\u52bf\u3002\u5b83\u4f7f\u5f97\u4e00\u4e2a\u5355\u70b9\u89e6\u6478\u53ef\u4ee5\u63a5\u53d7\u66f4\u591a\u7684\u89e6\u6478\u64cd\u4f5c\uff0c\u4e5f\u53ef\u4ee5\u7528\u4e8e\u8bc6\u522b\u7b80\u5355\u7684\u591a\u70b9\u89e6\u6478\u624b\u52bf\u3002","sidebar":"api"},"performance":{"id":"performance","title":"\u6027\u80fd\u7efc\u8ff0","description":"\u4f7f\u7528 React Native \u66ff\u4ee3\u57fa\u4e8e WebView \u7684\u6846\u67b6\u6765\u5f00\u53d1 App \u7684\u4e00\u4e2a\u5f3a\u6709\u529b\u7684\u7406\u7531\uff0c\u5c31\u662f\u4e3a\u4e86\u4f7f App \u53ef\u4ee5\u8fbe\u5230\u6bcf\u79d2 60 \u5e27\uff08\u8db3\u591f\u6d41\u7545\uff09\uff0c\u5e76\u4e14\u80fd\u6709\u7c7b\u4f3c\u539f\u751f App \u7684\u5916\u89c2\u548c\u624b\u611f\u3002\u56e0\u6b64\u6211\u4eec\u4e5f\u5c3d\u53ef\u80fd\u5730\u4f18\u5316 React Native \u53bb\u5b9e\u73b0\u8fd9\u4e00\u76ee\u6807\uff0c\u4f7f\u5f00\u53d1\u8005\u80fd\u96c6\u4e2d\u7cbe\u529b\u5904\u7406 App \u7684\u4e1a\u52a1\u903b\u8f91\uff0c\u800c\u4e0d\u7528\u8d39\u5fc3\u8003\u8651\u6027\u80fd\u3002\u4f46\u662f\uff0c\u603b\u8fd8\u662f\u6709\u4e00\u4e9b\u5730\u65b9\u6709\u6240\u6b20\u7f3a\uff0c\u4ee5\u53ca\u5728\u67d0\u4e9b\u573a\u5408 React Native \u8fd8\u4e0d\u80fd\u591f\u66ff\u4f60\u51b3\u5b9a\u5982\u4f55\u8fdb\u884c\u4f18\u5316\uff08\u7528\u539f\u751f\u4ee3\u7801\u5199\u4e5f\u65e0\u6cd5\u907f\u514d\uff09\uff0c\u56e0\u6b64\u4eba\u5de5\u7684\u5e72\u9884\u4f9d\u7136\u662f\u5fc5\u8981\u7684\u3002","sidebar":"docs"},"permissionsandroid":{"id":"permissionsandroid","title":"PermissionsAndroid","description":"\u4ec5\u9002\u7528\u4e8e\u975e\u6c99\u76d2\u9879\u76ee","sidebar":"api"},"pixelratio":{"id":"pixelratio","title":"PixelRatio","description":"PixelRatio \u53ef\u4ee5\u83b7\u53d6\u5230\u8bbe\u5907\u7684\u50cf\u7d20\u5bc6\u5ea6\u548c\u5b57\u4f53\u7f29\u653e\u6bd4\u3002","sidebar":"api"},"platform":{"id":"platform","title":"Platform","description":"Example","sidebar":"api"},"platform-specific-code":{"id":"platform-specific-code","title":"\u7279\u5b9a\u5e73\u53f0\u4ee3\u7801","description":"\u5728\u7f16\u5199\u8de8\u5e73\u53f0\u7684\u5e94\u7528\u65f6\uff0c\u6211\u4eec\u80af\u5b9a\u5e0c\u671b\u5c3d\u53ef\u80fd\u591a\u5730\u590d\u7528\u4ee3\u7801\u3002\u4f46\u662f\u603b\u6709\u4e9b\u65f6\u5019\u6211\u4eec\u4f1a\u78b0\u5230\u9488\u5bf9\u4e0d\u540c\u5e73\u53f0\u7f16\u5199\u4e0d\u540c\u4ee3\u7801\u7684\u9700\u6c42\u3002","sidebar":"docs"},"platformcolor":{"id":"platformcolor","title":"PlatformColor","description":"You can use the PlatformColor function to access native colors on the target platform by supplying the native color\u2019s corresponding string value. You pass a string to the PlatformColor function and, provided it exists on that platform, it will return the corresponding native color, which you can apply in any part of your application.","sidebar":"api"},"pressable":{"id":"pressable","title":"Pressable","description":"Pressable \u662f\u4e00\u4e2a\u6838\u5fc3\u7ec4\u4ef6\u7684\u5c01\u88c5\uff0c\u5b83\u53ef\u4ee5\u68c0\u6d4b\u5230\u4efb\u610f\u5b50\u7ec4\u4ef6\u7684\u4e0d\u540c\u9636\u6bb5\u7684\u6309\u538b\u4ea4\u4e92\u60c5\u51b5\u3002","sidebar":"\u7ec4\u4ef6"},"pressevent":{"id":"pressevent","title":"\u70b9\u51fb\u4e8b\u4ef6\u5bf9\u8c61","description":"\u70b9\u51fb\u4e8b\u4ef6\u5bf9\u8c61\u4f5c\u4e3a\u7528\u6237\u6309\u538b\u4ea4\u4e92\u7684\u7ed3\u679c\u5728\u56de\u8c03\u4e2d\u8fd4\u56de\uff0c\u4f8b\u5982 Button \u7ec4\u4ef6\u4e2d\u7684 onPress\u3002","sidebar":"\u7ec4\u4ef6"},"profile-hermes":{"id":"profile-hermes","title":"\u5728 Hermes \u4e2d\u8fdb\u884c\u6027\u80fd\u5206\u6790","description":"\u4f60\u53ef\u4ee5\u4f7f\u7528Hermes\u5728 React Native \u5e94\u7528\u4e2d\u53ef\u89c6\u5316 JavaScript \u7684\u6027\u80fd\u3002Hermes \u662f\u4e00\u4e2a\u5c0f\u578b\u4e14\u8f7b\u91cf\u7684 JavaScript \u5f15\u64ce\uff08\u4f60\u53ef\u4ee5\u5728\u8fd9\u91cc\u9605\u8bfb\u66f4\u591a\u6709\u5173\u5728 React Native \u4e2d\u4f7f\u7528\u5b83\u7684\u4fe1\u606f\uff09\u3002Hermes \u6709\u52a9\u4e8e\u63d0\u9ad8\u5e94\u7528\u6027\u80fd\uff0c\u5e76\u4e14\u8fd8\u63d0\u4f9b\u4e86\u5206\u6790\u5176\u8fd0\u884c\u7684 JavaScript \u6027\u80fd\u7684\u65b9\u5f0f\u3002"},"profiling":{"id":"profiling","title":"Profiling","description":"\u4f7f\u7528\u5185\u7f6e\u7684\u6027\u80fd\u5206\u6790\u5668\u83b7\u53d6 JavaScript \u7ebf\u7a0b\u548c\u4e3b\u7ebf\u7a0b\u5e76\u6392\u7684\u8be6\u7ec6\u5de5\u4f5c\u4fe1\u606f\u3002\u4ece\u8c03\u8bd5\u83dc\u5355\u4e2d\u9009\u62e9 Perf Monitor \u5373\u53ef\u8bbf\u95ee\u5b83\u3002","sidebar":"docs"},"progressbarandroid":{"id":"progressbarandroid","title":"\ud83d\udea7 ProgressBarAndroid","description":"\u5df2\u8fc7\u65f6\u3002 Use @react-native-community/progress-bar-android instead."},"progressviewios":{"id":"progressviewios","title":"\ud83d\udea7 ProgressViewIOS","description":"\u5df2\u8fc7\u65f6\u3002 Use @react-native-community/progress-view instead."},"props":{"id":"props","title":"Props\uff08\u5c5e\u6027\uff09","description":"\u5927\u591a\u6570\u7ec4\u4ef6\u5728\u521b\u5efa\u65f6\u5c31\u53ef\u4ee5\u4f7f\u7528\u5404\u79cd\u53c2\u6570\u6765\u8fdb\u884c\u5b9a\u5236\u3002\u7528\u4e8e\u5b9a\u5236\u7684\u8fd9\u4e9b\u53c2\u6570\u5c31\u79f0\u4e3aprops\uff08\u5c5e\u6027\uff09\u3002"},"publishing-to-app-store":{"id":"publishing-to-app-store","title":"\u4e0a\u67b6 App Store","description":"\u4e0a\u67b6\u5e94\u7528\u7684\u8fc7\u7a0b\u548c\u4efb\u4f55\u5176\u5b83\u539f\u751f iOS \u5e94\u7528\u4e00\u6837\uff0c\u4f46\u6709\u4e00\u4e9b\u989d\u5916\u7684\u6ce8\u610f\u4e8b\u9879\u8981\u8003\u8651\u3002","sidebar":"docs"},"pushnotificationios":{"id":"pushnotificationios","title":"\ud83d\udea7 PushNotificationIOS","description":"\u5df2\u8fc7\u65f6\u3002 Use @react-native-community/push-notification-ios instead."},"ram-bundles-inline-requires":{"id":"ram-bundles-inline-requires","title":"RAM Bundles \u548c\u5185\u8054\u5f15\u7528\u4f18\u5316","description":"\u5982\u679c\u4f60\u6709\u4e00\u4e2a\u8f83\u4e3a\u5e9e\u5927\u7684\u5e94\u7528\u7a0b\u5e8f\uff0c\u4f60\u53ef\u80fd\u8981\u8003\u8651\u4f7f\u7528RAM(Random Access Modules\uff0c\u968f\u673a\u5b58\u53d6\u6a21\u5757\uff09\u683c\u5f0f\u7684 bundle \u548c\u5185\u8054\u5f15\u7528\u3002\u8fd9\u5bf9\u4e8e\u5177\u6709\u5927\u91cf\u9875\u9762\u7684\u5e94\u7528\u7a0b\u5e8f\u662f\u975e\u5e38\u6709\u7528\u7684\uff0c\u8fd9\u4e9b\u9875\u9762\u5728\u5e94\u7528\u7a0b\u5e8f\u7684\u5178\u578b\u4f7f\u7528\u8fc7\u7a0b\u4e2d\u53ef\u80fd\u4e0d\u4f1a\u88ab\u6253\u5f00\u3002\u901a\u5e38\u5bf9\u4e8e\u542f\u52a8\u540e\u4e00\u6bb5\u65f6\u95f4\u5185\u4e0d\u9700\u8981\u5927\u91cf\u4ee3\u7801\u7684\u5e94\u7528\u7a0b\u5e8f\u6765\u8bf4\u662f\u975e\u5e38\u6709\u7528\u7684\u3002\u4f8b\u5982\u5e94\u7528\u7a0b\u5e8f\u5305\u542b\u590d\u6742\u7684\u914d\u7f6e\u6587\u4ef6\u5c4f\u5e55\u6216\u8f83\u5c11\u4f7f\u7528\u7684\u529f\u80fd\uff0c\u4f46\u5927\u591a\u6570\u4f1a\u8bdd\u53ea\u6d89\u53ca\u8bbf\u95ee\u5e94\u7528\u7a0b\u5e8f\u7684\u4e3b\u5c4f\u5e55\u66f4\u65b0\u3002\u6211\u4eec\u53ef\u4ee5\u901a\u8fc7\u4f7f\u7528RAM\u683c\u5f0f\u6765\u4f18\u5316bundle\u7684\u52a0\u8f7d\uff0c\u5e76\u4e14\u5185\u8054\u5f15\u7528\u8fd9\u4e9b\u529f\u80fd\u548c\u9875\u9762\uff08\u5f53\u5b83\u4eec\u88ab\u5b9e\u9645\u4f7f\u7528\u65f6\uff09\u3002"},"react-18-and-react-native":{"id":"react-18-and-react-native","title":"React 18 \u4e0e React Native","description":"\u8fd9\u4e2a\u9875\u9762\u63cf\u8ff0\u4e86\u5982\u4f55\u5728 React Native \u7684\u65b0\u67b6\u6784\u4e2d\u542f\u7528 React 18 \u7248\u672c\u3002"},"react-native-devtools":{"id":"react-native-devtools","title":"React Native \u5f00\u53d1\u8005\u5de5\u5177","description":"React Native DevTools \u662f\u6211\u4eec\u65b0\u7684\u8c03\u8bd5\u4f53\u9a8c\uff0c\u5b83\u5bf9\u6211\u4eec\u7684\u8c03\u8bd5\u5806\u6808\u8fdb\u884c\u4e86\u7aef\u5230\u7aef\u7684\u91cd\u65b0\u7f16\u5199\u3002\u5b83\u65e8\u5728\u6bd4\u4ee5\u524d\u7684\u8c03\u8bd5\u65b9\u6cd5\u66f4\u6df1\u5165\u5730\u96c6\u6210\uff0c\u5e76\u4e14\u4ece\u6839\u672c\u4e0a\u66f4\u53ef\u9760\u3002","sidebar":"docs"},"react-native-gradle-plugin":{"id":"react-native-gradle-plugin","title":"React Native Gradle Plugin","description":"\u672c\u6307\u5357\u63cf\u8ff0\u4e86\u5982\u4f55\u914d\u7f6e React Native Gradle Plugin\uff08\u901a\u5e38\u79f0\u4e3a RNGP\uff09\u6765\u4e3a Android \u6784\u5efa React Native \u5e94\u7528\u3002","sidebar":"docs"},"react-node":{"id":"react-node","title":"React \u8282\u70b9\u5bf9\u8c61","description":"React \u8282\u70b9\u5bf9\u8c61\u6709\u4ee5\u4e0b\u8fd9\u4e9b\u7c7b\u578b\uff1a","sidebar":"\u7ec4\u4ef6"},"rect":{"id":"rect","title":"\u77e9\u5f62\u533a\u57df\u5bf9\u8c61","description":"Rect \u63a5\u53d7\u6570\u503c\u50cf\u7d20\u503c\u6765\u63cf\u8ff0\u5982\u4f55\u6269\u5c55\u77e9\u5f62\u533a\u57df\u3002\u8fd9\u4e9b\u503c\u4f1a\u88ab\u6dfb\u52a0\u5230\u539f\u59cb\u533a\u57df\u7684\u5927\u5c0f\u4e0a\u4ee5\u6269\u5c55\u5b83\u3002","sidebar":"\u7ec4\u4ef6"},"rectorsize":{"id":"rectorsize","title":"RectOrSize Object Type","description":"RectOrSize\u63a5\u53d7\u6570\u5b57\u50cf\u7d20\u503c\u6765\u63cf\u8ff0\u5982\u4f55\u6269\u5c55\u77e9\u5f62\u533a\u57df\u3002\u8fd9\u4e9b\u503c\u4f1a\u88ab\u6dfb\u52a0\u5230\u539f\u59cb\u533a\u57df\u7684\u5927\u5c0f\u4e0a\u4ee5\u6269\u5c55\u5b83\u3002"},"refreshcontrol":{"id":"refreshcontrol","title":"RefreshControl","description":"\u8fd9\u4e00\u7ec4\u4ef6\u53ef\u4ee5\u7528\u5728 ScrollView \u6216 FlatList \u5185\u90e8\uff0c\u4e3a\u5176\u6dfb\u52a0\u4e0b\u62c9\u5237\u65b0\u7684\u529f\u80fd\u3002\u5f53 ScrollView \u5904\u4e8e\u7ad6\u76f4\u65b9\u5411\u7684\u8d77\u70b9\u4f4d\u7f6e\uff08scrollY: 0\uff09\uff0c\u6b64\u65f6\u4e0b\u62c9\u4f1a\u89e6\u53d1\u4e00\u4e2aonRefresh\u4e8b\u4ef6\u3002","sidebar":"\u7ec4\u4ef6"},"removing-default-permissions":{"id":"removing-default-permissions","title":"\u79fb\u9664\u4e0d\u9700\u8981\u7684\u6743\u9650","description":"\u9ed8\u8ba4\u60c5\u51b5\u4e0b\u6211\u4eec\u4f1a\u7ed9\u6700\u7ec8\u6253\u5305\u7684 APK \u52a0\u5165\u4e00\u4e9b\u6743\u9650\u7533\u8bf7\uff0c\u5177\u4f53\u5982\u4e0b\uff1a"},"render-pipeline":{"id":"render-pipeline","title":"\u6e32\u67d3\uff0c\u63d0\u4ea4\u4e0e\u6302\u8f7d\uff08\u6e32\u67d3\u6d41\u6c34\u7ebf\uff09","description":"\u6587\u6863\u4ecb\u7ecd\u4e86\u5373\u5c06\u53d1\u5e03\u7684\u65b0\u6e32\u67d3\u5668 Fabric \u7684\u67b6\u6784\u3002"},"roottag":{"id":"roottag","title":"RootTag","description":"RootTag \u662f\u7528\u4e8e\u6807\u8bb0 React Native \u539f\u751f\u6839\u89c6\u56fe\u5c42\u7684\u4e0d\u900f\u660e\u6807\u8bc6\u7b26\uff08opaque identifier\uff09\u3002\u5177\u4f53\u6765\u8bf4\u5c31\u662f ReactRootView(android) \u6216\u662f RCTRootView(iOS) \u7684\u5b9e\u4f8b ID.","sidebar":"api"},"running-on-device":{"id":"running-on-device","title":"\u5728\u8bbe\u5907\u4e0a\u8fd0\u884c","description":"\u5728\u771f\u673a\u4e0a\u4ed4\u7ec6\u6d4b\u8bd5 app \u540e\u518d\u53d1\u5e03\u7ed9\u7528\u6237\u603b\u662f\u4e0d\u4f1a\u9519\u7684\u3002\u672c\u6587\u6863\u5c06\u6307\u5bfc\u4f60\u901a\u8fc7\u5fc5\u987b\u7684\u6b65\u9aa4\u5728\u8bbe\u5907\u4e0a\u8fd0\u884c React Native app\uff0c\u4e3a\u751f\u4ea7\u505a\u51c6\u5907\u3002","sidebar":"docs"},"running-on-simulator-ios":{"id":"running-on-simulator-ios","title":"\u5728iOS\u6a21\u62df\u5668\u4e0a\u8fd0\u884c","description":"\u542f\u52a8\u6a21\u62df\u5668","sidebar":"docs"},"safeareaview":{"id":"safeareaview","title":"SafeAreaView","description":"SafeAreaView\u7684\u76ee\u7684\u662f\u5728\u4e00\u4e2a\u201c\u5b89\u5168\u201d\u7684\u53ef\u89c6\u533a\u57df\u5185\u6e32\u67d3\u5185\u5bb9\u3002\u5177\u4f53\u6765\u8bf4\u5c31\u662f\u56e0\u4e3a\u76ee\u524d\u6709 iPhone X \u8fd9\u6837\u7684\u5e26\u6709\u201c\u5218\u6d77\u201d\u7684\u5168\u9762\u5c4f\u8bbe\u5907\uff0c\u6240\u4ee5\u9700\u8981\u907f\u514d\u5185\u5bb9\u6e32\u67d3\u5230\u4e0d\u53ef\u89c1\u7684\u201c\u5218\u6d77\u201d\u8303\u56f4\u5185\u3002\u672c\u7ec4\u4ef6\u76ee\u524d\u4ec5\u652f\u6301 iOS \u8bbe\u5907\u4ee5\u53ca iOS 11 \u6216\u66f4\u9ad8\u7248\u672c\u3002","sidebar":"\u7ec4\u4ef6"},"sample-application-movies":{"id":"sample-application-movies","title":"\u793a\u4f8b\u6559\u7a0b\uff1a\u7535\u5f71\u5217\u8868","description":"\u7b80\u4ecb"},"scrollview":{"id":"scrollview","title":"ScrollView","description":"\u4e00\u4e2a\u5c01\u88c5\u4e86\u5e73\u53f0\u7684 ScrollView\uff08\u6eda\u52a8\u89c6\u56fe\uff09\u7684\u7ec4\u4ef6\uff0c\u540c\u65f6\u8fd8\u96c6\u6210\u4e86\u89e6\u6478\u9501\u5b9a\u7684\u201c\u54cd\u5e94\u8005\u201d\u7cfb\u7edf\u3002","sidebar":"\u7ec4\u4ef6"},"sectionlist":{"id":"sectionlist","title":"SectionList","description":"\u9ad8\u6027\u80fd\u7684\u5206\u7ec4(section)\u5217\u8868\u7ec4\u4ef6\uff0c\u652f\u6301\u4e0b\u9762\u8fd9\u4e9b\u5e38\u7528\u7684\u529f\u80fd\uff1a","sidebar":"\u7ec4\u4ef6"},"security":{"id":"security","title":"\u7f51\u7edc\u5b89\u5168\u7b56\u7565","description":"\u5f00\u53d1\u5e94\u7528\u65f6\u5b89\u5168\u5e38\u5e38\u662f\u4e00\u4e2a\u88ab\u5ffd\u89c6\u7684\u8bdd\u9898\u3002\u7684\u786e\uff0c\u642d\u5efa\u4e00\u4e2a\u5b8c\u5168\u65e0\u61c8\u53ef\u51fb\u7684\u8f6f\u4ef6\u662f\u4e0d\u53ef\u80fd\u7684\u2014\u2014\u6211\u4eec\u8fd8\u6ca1\u6709\u53d1\u660e\u4e00\u4e2a\u5b8c\u5168\u575a\u4e0d\u53ef\u6467\u7684\u9501\uff08\u6bd5\u7adf\uff0c\u94f6\u884c\u91d1\u5e93\u5df2\u7ecf\u8db3\u591f\u575a\u56fa\u4f46\u4ecd\u7136\u4f1a\u88ab\u95ef\u5165\uff09\u3002\u7136\u800c\uff0c\u906d\u53d7\u6076\u610f\u653b\u51fb\u6216\u66b4\u9732\u5b89\u5168\u6f0f\u6d1e\u7684\u53ef\u80fd\u6027\u4e0e\u60a8\u613f\u610f\u6295\u5165\u4fdd\u62a4\u5e94\u7528\u7a0b\u5e8f\u514d\u53d7\u6b64\u7c7b\u4e8b\u4ef6\u7684\u52aa\u529b\u6210\u53cd\u6bd4\u3002\u5c3d\u7ba1\u666e\u901a\u7684\u6302\u9501\u53ef\u4ee5\u88ab\u64ac\u5f00\uff0c\u4f46\u5b83\u4ecd\u7136\u6bd4\u6a71\u67dc\u6302\u94a9\u66f4\u96be\u653b\u7834\uff01","sidebar":"docs"},"segmentedcontrolios":{"id":"segmentedcontrolios","title":"\ud83d\udea7 SegmentedControlIOS","description":"\u5df2\u8fc7\u65f6\u3002 Use @react-native-community/segmented-control instead."},"settings":{"id":"settings","title":"Settings","description":"Settings\u662f\u5bf9NSUserDefaults\u7684\u5c01\u88c5\u3002\u5b83\u662fiOS\u5e73\u53f0\u4e0a\u7684\u4e00\u79cd\u6301\u4e45\u7684\u952e\u503c\u5bf9\u5b58\u50a8\u3002","sidebar":"api"},"shadow-props":{"id":"shadow-props","title":"\u9634\u5f71\u6837\u5f0f\u5c5e\u6027","description":"These properties are iOS only - for similar functionality on Android, use the elevation property.","sidebar":"\u7ec4\u4ef6"},"share":{"id":"share","title":"Share","description":"\u793a\u4f8b","sidebar":"api"},"signed-apk-android":{"id":"signed-apk-android","title":"\u6253\u5305\u53d1\u5e03","description":"Android \u8981\u6c42\u6240\u6709\u5e94\u7528\u90fd\u6709\u4e00\u4e2a\u6570\u5b57\u7b7e\u540d\u624d\u4f1a\u88ab\u5141\u8bb8\u5b89\u88c5\u5728\u7528\u6237\u624b\u673a\u4e0a\uff0c\u6240\u4ee5\u5728\u628a\u5e94\u7528\u53d1\u5e03\u5230\u5e94\u7528\u5e02\u573a\u4e4b\u524d\uff0c\u4f60\u9700\u8981\u5148\u751f\u6210\u4e00\u4e2a\u7b7e\u540d\u7684 AAB \u6216 APK \u5305\uff08Google Play \u73b0\u5728\u8981\u6c42 AAB \u683c\u5f0f\uff0c\u800c\u56fd\u5185\u7684\u5e94\u7528\u5e02\u573a\u76ee\u524d\u4ec5\u652f\u6301 APK \u683c\u5f0f\u3002\u4f46\u65e0\u8bba\u54ea\u79cd\u683c\u5f0f\uff0c\u4e0b\u9762\u7684\u7b7e\u540d\u6b65\u9aa4\u662f\u4e00\u6837\u7684\uff09\u3002Android \u5f00\u53d1\u8005\u5b98\u7f51\u4e0a\u7684\u5982\u4f55\u7ed9\u4f60\u7684\u5e94\u7528\u7b7e\u540d\u6587\u6863\u63cf\u8ff0\u4e86\u7b7e\u540d\u7684\u7ec6\u8282\u3002\u672c\u6307\u5357\u65e8\u5728\u63d0\u4f9b\u4e00\u4e2a\u7b80\u5316\u7684\u7b7e\u540d\u548c\u6253\u5305\u7684\u64cd\u4f5c\u6b65\u9aa4\uff0c\u4e0d\u4f1a\u6d89\u53ca\u592a\u591a\u7406\u8bba\u3002","sidebar":"docs"},"slider":{"id":"slider","title":"\ud83d\udea7 Slider","description":"\u5df2\u8fc7\u65f6\u3002 Use @react-native-community/slider instead."},"speeding-ci-builds":{"id":"speeding-ci-builds","title":"\u4f18\u5316 CI \u6784\u5efa","description":"You or your company may have set up a Continuous Integration (CI) environment to test your React Native application."},"state":{"id":"state","title":"State\uff08\u72b6\u6001\uff09","description":"\u6211\u4eec\u4f7f\u7528\u4e24\u79cd\u6570\u636e\u6765\u63a7\u5236\u4e00\u4e2a\u7ec4\u4ef6\uff1aprops\u548cstate\u3002props\u662f\u5728\u7236\u7ec4\u4ef6\u4e2d\u6307\u5b9a\uff0c\u800c\u4e14\u4e00\u7ecf\u6307\u5b9a\uff0c\u5728\u88ab\u6307\u5b9a\u7684\u7ec4\u4ef6\u7684\u751f\u547d\u5468\u671f\u4e2d\u5219\u4e0d\u518d\u6539\u53d8\u3002\u5bf9\u4e8e\u9700\u8981\u6539\u53d8\u7684\u6570\u636e\uff0c\u6211\u4eec\u9700\u8981\u4f7f\u7528state\u3002"},"statusbar":{"id":"statusbar","title":"StatusBar","description":"\u63a7\u5236\u5e94\u7528\u72b6\u6001\u680f\u7684\u7ec4\u4ef6\u3002","sidebar":"\u7ec4\u4ef6"},"style":{"id":"style","title":"\u6837\u5f0f","description":"\u5728 React Native \u4e2d\uff0c\u4f60\u5e76\u4e0d\u9700\u8981\u5b66\u4e60\u4ec0\u4e48\u7279\u6b8a\u7684\u8bed\u6cd5\u6765\u5b9a\u4e49\u6837\u5f0f\u3002\u6211\u4eec\u4ecd\u7136\u662f\u4f7f\u7528 JavaScript \u6765\u5199\u6837\u5f0f\u3002\u6240\u6709\u7684\u6838\u5fc3\u7ec4\u4ef6\u90fd\u63a5\u53d7\u540d\u4e3astyle\u7684\u5c5e\u6027\u3002\u8fd9\u4e9b\u6837\u5f0f\u540d\u57fa\u672c\u4e0a\u662f\u9075\u5faa\u4e86 web \u4e0a\u7684 CSS \u7684\u547d\u540d\uff0c\u53ea\u662f\u6309\u7167 JS \u7684\u8bed\u6cd5\u8981\u6c42\u4f7f\u7528\u4e86\u9a7c\u5cf0\u547d\u540d\u6cd5\uff0c\u4f8b\u5982\u5c06background-color\u6539\u4e3abackgroundColor\u3002","sidebar":"docs"},"stylesheet":{"id":"stylesheet","title":"StyleSheet","description":"StyleSheet \u63d0\u4f9b\u4e86\u4e00\u79cd\u7c7b\u4f3c CSS \u6837\u5f0f\u8868\u7684\u62bd\u8c61\u3002","sidebar":"api"},"switch":{"id":"switch","title":"Switch","description":"\u8de8\u5e73\u53f0\u901a\u7528\u7684\u201c\u5f00\u5173\u201d\u7ec4\u4ef6\u3002","sidebar":"\u7ec4\u4ef6"},"symbolication":{"id":"symbolication","title":"Symbolicating a stack trace","description":"If a React Native app throws an unhandled exception in a release build, the output may be obfuscated and hard to read:"},"systrace":{"id":"systrace","title":"Systrace","description":"Systrace is a standard Android marker-based profiling tool (and is installed when you install the Android platform-tools package). Profiled code blocks are surrounded by start/end markers which are then visualized in a colorful chart format. Both the Android SDK and React Native framework provide standard markers that you can visualize.","sidebar":"api"},"testing-overview":{"id":"testing-overview","title":"Testing","description":"This guide introduces React Native developers to the key concepts behind testing, how to write good tests, and what kinds of tests you can incorporate into your workflow.","sidebar":"docs"},"text":{"id":"text","title":"Text","description":"\u4e00\u4e2a\u7528\u4e8e\u663e\u793a\u6587\u672c\u7684 React \u7ec4\u4ef6\uff0c\u5e76\u4e14\u5b83\u4e5f\u652f\u6301\u5d4c\u5957\u3001\u6837\u5f0f\uff0c\u4ee5\u53ca\u89e6\u6478\u5904\u7406\u3002","sidebar":"\u7ec4\u4ef6"},"text-style-props":{"id":"text-style-props","title":"Text \u6837\u5f0f\u5c5e\u6027","description":"\u793a\u4f8b","sidebar":"\u7ec4\u4ef6"},"textinput":{"id":"textinput","title":"TextInput","description":"TextInput \u662f\u4e00\u4e2a\u5141\u8bb8\u7528\u6237\u5728\u5e94\u7528\u4e2d\u901a\u8fc7\u952e\u76d8\u8f93\u5165\u6587\u672c\u7684\u57fa\u672c\u7ec4\u4ef6\u3002\u672c\u7ec4\u4ef6\u7684\u5c5e\u6027\u63d0\u4f9b\u4e86\u591a\u79cd\u7279\u6027\u7684\u914d\u7f6e\uff0c\u8b6c\u5982\u81ea\u52a8\u5b8c\u6210\u3001\u81ea\u52a8\u5927\u5c0f\u5199\u3001\u5360\u4f4d\u6587\u5b57\uff0c\u4ee5\u53ca\u591a\u79cd\u4e0d\u540c\u7684\u952e\u76d8\u7c7b\u578b\uff08\u5982\u7eaf\u6570\u5b57\u952e\u76d8\uff09\u7b49\u7b49\u3002","sidebar":"\u7ec4\u4ef6"},"the-new-architecture/backward-compatibility":{"id":"the-new-architecture/backward-compatibility","title":"\u5411\u540e\u517c\u5bb9\u7684\u610f\u4e49","description":"\u521b\u5efa\u4e00\u4e2a\u5411\u540e\u517c\u5bb9\u7684\u6a21\u5757\u5f88\u91cd\u8981\uff0c\u8fd9\u6837\u53ef\u4ee5\u5b9e\u73b0\u5728\u65e7\u67b6\u6784\u548c\u65b0\u67b6\u6784\u4e2d\u90fd\u80fd\u5de5\u4f5c\u7684\u5e93\u3002\u5e76\u4e0d\u662f\u6240\u6709\u7528\u6237\u90fd\u4f1a\u7acb\u523b\u8f6c\u5230\u65b0\u67b6\u6784\uff0c\u6700\u597d\u5728\u4ed6\u4eec\u4f7f\u7528\u65e7\u67b6\u6784\u65f6\u4ecd\u7136\u4fdd\u6301\u517c\u5bb9\u3002"},"the-new-architecture/backward-compatibility-fabric-components":{"id":"the-new-architecture/backward-compatibility-fabric-components","title":"\u4f7f Fabric \u7ec4\u4ef6\u4e0e\u4f20\u7edf\u539f\u751f\u7ec4\u4ef6\u517c\u5bb9","description":"\u521b\u5efa\u5411\u540e\u517c\u5bb9\u7684 Fabric \u539f\u751f\u7ec4\u4ef6\u9700\u8981\u4e86\u89e3\u5982\u4f55\u521b\u5efa\u4f20\u7edf\u7684\u539f\u751f\u7ec4\u4ef6\u3002\u8981\u56de\u5fc6\u8fd9\u4e9b\u6982\u5ff5\uff0c\u8bf7\u67e5\u770b\u6b64\u6307\u5357\u3002"},"the-new-architecture/backward-compatibility-turbomodules":{"id":"the-new-architecture/backward-compatibility-turbomodules","title":"\u4f7f Turbo \u6a21\u5757\u4e0e\u4f20\u7edf\u539f\u751f\u6a21\u5757\u517c\u5bb9","description":"\u521b\u5efa\u5411\u540e\u517c\u5bb9\u7684 Turbo \u539f\u751f\u6a21\u5757\u9700\u8981\u4e86\u89e3\u5982\u4f55\u521b\u5efa\u4f20\u7edf\u7684\u539f\u751f\u6a21\u5757\u3002\u8981\u56de\u5fc6\u8fd9\u4e9b\u6982\u5ff5\uff0c\u8bf7\u67e5\u770b\u6b64\u6307\u5357\u3002"},"the-new-architecture/codegen-cli":{"id":"the-new-architecture/codegen-cli","title":"Codegen \u547d\u4ee4\u884c\u5de5\u5177","description":"\u8c03\u7528 Gradle \u6216\u624b\u52a8\u8c03\u7528\u811a\u672c\u53ef\u80fd\u5f88\u96be\u8bb0\u4f4f\uff0c\u5e76\u4e14\u9700\u8981\u5f88\u591a\u6b65\u9aa4\u3002","sidebar":"docs"},"the-new-architecture/create-module-library":{"id":"the-new-architecture/create-module-library","title":"\u521b\u5efa\u6a21\u5757\u5e93","description":"React Native \u6709\u4e00\u4e2a\u4e30\u5bcc\u7684\u751f\u6001\u7cfb\u7edf\u5e93\u6765\u89e3\u51b3\u5e38\u89c1\u95ee\u9898\u3002\u6211\u4eec\u5728 reactnative.directory \u7f51\u7ad9\u4e0a\u6536\u96c6 React Native \u5e93\uff0c\u8fd9\u662f\u4e00\u4e2a\u5f88\u597d\u7684\u8d44\u6e90\uff0c\u503c\u5f97\u6bcf\u4e2a React Native \u5f00\u53d1\u8005\u6536\u85cf\u3002","sidebar":"docs"},"the-new-architecture/custom-cxx-types":{"id":"the-new-architecture/custom-cxx-types","title":"\u9ad8\u7ea7\uff1a\u81ea\u5b9a\u4e49 C++ \u7c7b\u578b","description":"\u672c\u6307\u5357\u5047\u8bbe\u4f60\u719f\u6089 \u7eaf C++ Turbo Native \u6a21\u5757 \u6307\u5357\u3002\u5b83\u5c06\u5728\u6b64\u57fa\u7840\u4e0a\u8fdb\u884c\u6784\u5efa\u3002","sidebar":"docs"},"the-new-architecture/cxx-custom-types":{"id":"the-new-architecture/cxx-custom-types","title":"\u652f\u6301\u81ea\u5b9a\u4e49 C++ \u7c7b\u578b","description":"\u9ed8\u8ba4\u60c5\u51b5\u4e0b\uff0cC++ Turbo Native \u6a21\u5757\u652f\u6301\u5927\u591a\u6570 std:: \u6807\u51c6\u7c7b\u578b\u7684\u6865\u63a5\u529f\u80fd\u3002"},"the-new-architecture/cxx-cxxturbomodules":{"id":"the-new-architecture/cxx-cxxturbomodules","title":"C++ Turbo \u539f\u751f\u6a21\u5757","description":"\u672c\u6307\u5357\u5c06\u5411\u60a8\u5c55\u793a\u5982\u4f55\u4ec5\u4f7f\u7528 C++ \u5b9e\u73b0 Turbo \u539f\u751f\u6a21\u5757\uff0c\u4ee5\u4fbf\u4e0e\u4efb\u4f55\u652f\u6301\u7684\u5e73\u53f0\uff08Android\u3001iOS\u3001macOS \u6216 Windows\uff09\u5171\u4eab\u76f8\u540c\u7684\u5b9e\u73b0\u3002"},"the-new-architecture/landing-page":{"id":"the-new-architecture/landing-page","title":"\u65b0\u67b6\u6784\u4ecb\u7ecd","description":"\u4ece 0.68 \u7248\u672c\u5f00\u59cb\uff0cReact Native \u63d0\u4f9b\u4e86\u65b0\u67b6\u6784\uff0c\u5b83\u4e3a\u5f00\u53d1\u8005\u63d0\u4f9b\u4e86\u6784\u5efa\u9ad8\u6027\u80fd\u548c\u54cd\u5e94\u5f0f\u5e94\u7528\u7684\u65b0\u529f\u80fd\u3002\u8bf7\u8bbf\u95ee\\"\u4e3a\u4f55\u8981\u8bbe\u8ba1\u65b0\u67b6\u6784\\"\u6765\u4e86\u89e3\u66f4\u591a\u5173\u4e8e\u4fc3\u4f7f\u6211\u4eec\u51b3\u5b9a\u91cd\u65b0\u67b6\u6784\u7684\u539f\u56e0\uff0c\u4ee5\u53ca\u5b83\u63d0\u4f9b\u7684\u597d\u5904\u3002"},"the-new-architecture/pillars":{"id":"the-new-architecture/pillars","title":"\u65b0\u67b6\u6784\u7684\u4e24\u5927\u652f\u67f1","description":"\u65b0\u67b6\u6784\u4e3b\u8981\u7531\u4e24\u5927\u652f\u67f1\u7ec4\u6210\uff1a"},"the-new-architecture/pillars-codegen":{"id":"the-new-architecture/pillars-codegen","title":"Codegen","description":"Codegen \u4e0d\u7b97\u662f\u65b0\u67b6\u6784\u7684\u4e3b\u8981\u7ec4\u6210\u90e8\u5206\uff0c\u5b83\u662f\u4e00\u4e2a\u5e2e\u52a9\u6211\u4eec\u907f\u514d\u7f16\u5199\u91cd\u590d\u4ee3\u7801\u7684\u5de5\u5177\u3002Codegen \u5e76\u975e\u5fc5\u9009\u9879\uff0c\u60a8\u4ecd\u7136\u53ef\u4ee5\u624b\u5199\u5b83\u6240\u751f\u6210\u7684\u4ee3\u7801\uff0c\u4f46\u662f\u4f7f\u7528\u5b83\u6765\u751f\u6210\u811a\u624b\u67b6\u4ee3\u7801\u53ef\u4ee5\u5e2e\u60a8\u8282\u7701\u4e0d\u5c11\u65f6\u95f4\u3002"},"the-new-architecture/pillars-fabric-components":{"id":"the-new-architecture/pillars-fabric-components","title":"Fabric \u7ec4\u4ef6","description":"Fabric \u7ec4\u4ef6\u662f\u4e00\u79cd\u4f7f\u7528 Fabric \u6e32\u67d3\u5668\u6e32\u67d3\u5e76\u5c55\u793a\u5728\u5c4f\u5e55\u4e0a\u7684 UI \u7ec4\u4ef6\u3002\u5728\u65b0\u67b6\u6784\u4e2d\uff0c\u4f7f\u7528 Fabric \u7ec4\u4ef6\u66ff\u4ee3\u539f\u751f\u7ec4\u4ef6\u5177\u6709\u4ee5\u4e0b\u4f18\u52bf\uff1a"},"the-new-architecture/pillars-turbomodules":{"id":"the-new-architecture/pillars-turbomodules","title":"TurboModules","description":"\u5982\u679c\u60a8\u4f7f\u7528\u8fc7 React Native\uff0c\u60a8\u53ef\u80fd\u4e86\u89e3\u8fc7 Native Modules \u8fd9\u4e2a\u6982\u5ff5\u3002\u5b83\u53ef\u4ee5\u901a\u8fc7 React Native \u7684\u300cBridge\u300d\u5e2e\u52a9 JavaScript \u548c\u539f\u751f\u4ee3\u7801\u8fdb\u884c\u4ea4\u4e92\uff0c\u5e76\u4f7f\u7528\u8de8\u5e73\u53f0\u7684\u6570\u636e\u683c\u5f0f JSON \u8fdb\u884c\u901a\u8baf\u3002"},"the-new-architecture/pure-cxx-modules":{"id":"the-new-architecture/pure-cxx-modules","title":"\u7eaf C++ Turbo \u539f\u751f\u6a21\u5757","description":"\u7f16\u5199 C++ \u6a21\u5757\u662f\u8de8 Android \u548c iOS \u5171\u4eab\u5e73\u53f0\u65e0\u5173\u4ee3\u7801\u7684\u6700\u4f73\u65b9\u5f0f\u3002\u4f7f\u7528\u7eaf C++ \u6a21\u5757\uff0c\u60a8\u53ea\u9700\u7f16\u5199\u4e00\u6b21\u903b\u8f91\uff0c\u5373\u53ef\u5728\u6240\u6709\u5e73\u53f0\u4e0a\u91cd\u7528\u5b83\uff0c\u800c\u65e0\u9700\u7f16\u5199\u5e73\u53f0\u7279\u5b9a\u7684\u4ee3\u7801\u3002","sidebar":"docs"},"the-new-architecture/use-app-template":{"id":"the-new-architecture/use-app-template","title":"\u521b\u5efa\u542f\u7528\u65b0\u67b6\u6784\u7684\u5e94\u7528","description":"\u672c\u6587\u6863\u5c06\u5e2e\u52a9\u4f60\u4ece\u5934\u521b\u5efa\u4e00\u4e2a\u542f\u7528\u4e86\u65b0\u67b6\u6784\u7684 React Native \u5e94\u7528\u3002"},"the-new-architecture/using-codegen":{"id":"the-new-architecture/using-codegen","title":"\u4f7f\u7528 Codegen","description":"\u672c\u6307\u5357\u5c06\u6559\u4f60\u5982\u4f55\uff1a","sidebar":"docs"},"the-new-architecture/what-is-codegen":{"id":"the-new-architecture/what-is-codegen","title":"\u4ec0\u4e48\u662f Codegen\uff1f","description":"Codegen \u662f\u4e00\u4e2a\u907f\u514d\u7f16\u5199\u5927\u91cf\u91cd\u590d\u4ee3\u7801\u7684\u5de5\u5177\u3002\u4f7f\u7528 Codegen \u5e76\u4e0d\u662f\u5fc5\u987b\u7684\uff1a\u60a8\u53ef\u4ee5\u624b\u52a8\u7f16\u5199\u6240\u6709\u751f\u6210\u7684\u4ee3\u7801\u3002\u7136\u800c\uff0cCodegen \u751f\u6210\u7684\u811a\u624b\u67b6\u4ee3\u7801\u53ef\u4ee5\u8282\u7701\u60a8\u5f88\u591a\u65f6\u95f4\u3002","sidebar":"docs"},"the-new-architecture/why":{"id":"the-new-architecture/why","title":"\u4e3a\u4f55\u8981\u8bbe\u8ba1\u65b0\u67b6\u6784","description":"\u65b0\u67b6\u6784\u7684\u76ee\u6807\u662f\u89e3\u51b3\u56f0\u6270\u65e7\u67b6\u6784\u5728\u6027\u80fd\u548c\u7075\u6d3b\u6027\u65b9\u9762\u7684\u4e00\u4e9b\u95ee\u9898\u3002\u672c\u8282\u63d0\u4f9b\u4e86\u57fa\u672c\u7684\u80cc\u666f\uff0c\u4ee5\u4e86\u89e3\u65e7\u67b6\u6784\u7684\u5c40\u9650\u6027\uff0c\u4ee5\u53ca\u5982\u4f55\u901a\u8fc7\u65b0\u67b6\u6784\u6765\u514b\u670d\u8fd9\u4e9b\u5c40\u9650\u6027\u3002"},"threading-model":{"id":"threading-model","title":"\u7ebf\u7a0b\u6a21\u578b","description":"\u6587\u6863\u4ecb\u7ecd\u4e86\u5373\u5c06\u53d1\u5e03\u7684\u65b0\u6e32\u67d3\u5668 Fabric \u7684\u67b6\u6784\u3002"},"timepickerandroid":{"id":"timepickerandroid","title":"\ud83d\udea7 TimePickerAndroid","description":"\u5df2\u8fc7\u65f6\u3002 Use @react-native-community/datetimepicker instead."},"timers":{"id":"timers","title":"\u5b9a\u65f6\u5668","description":"\u5b9a\u65f6\u5668\u662f\u4e00\u4e2a\u5e94\u7528\u4e2d\u975e\u5e38\u91cd\u8981\u7684\u90e8\u5206\u3002React Native \u5b9e\u73b0\u4e86\u548c\u6d4f\u89c8\u5668\u4e00\u81f4\u7684\u5b9a\u65f6\u5668 Timer\u3002","sidebar":"docs"},"toastandroid":{"id":"toastandroid","title":"ToastAndroid","description":"\u672c\u6a21\u5757\u5c06\u539f\u751f\u7684 ToastAndroid \u6a21\u5757\u5bfc\u51fa\u4e3a\u4e00\u4e2a JS \u6a21\u5757\uff0c\u7528\u4e8e\u5728 Android \u8bbe\u5907\u4e0a\u663e\u793a\u4e00\u4e2a\u60ac\u6d6e\u7684\u63d0\u793a\u4fe1\u606f\u3002\u672c\u6a21\u5757\u5305\u542b\u4e00\u4e2ashow\u65b9\u6cd5\u63a5\u53d7\u4ee5\u4e0b\u7684\u53c2\u6570\uff1a","sidebar":"api"},"touchablehighlight":{"id":"touchablehighlight","title":"TouchableHighlight","description":"\u6211\u4eec\u5efa\u8bae\u4f7f\u7528Pressable\u7ec4\u4ef6\uff0c\u5b83\u66f4\u5177\u6269\u5c55\u6027\u4e14\u4f1a\u662f\u5b98\u65b9\u672a\u6765\u529b\u63a8\u7684\u4e3b\u6d41\u3002","sidebar":"\u7ec4\u4ef6"},"touchablenativefeedback":{"id":"touchablenativefeedback","title":"TouchableNativeFeedback","description":"If you\'re looking for a more extensive and future-proof way to handle touch-based input, check out the Pressable API.","sidebar":"\u7ec4\u4ef6"},"touchableopacity":{"id":"touchableopacity","title":"TouchableOpacity","description":"If you\'re looking for a more extensive and future-proof way to handle touch-based input, check out the Pressable API.","sidebar":"\u7ec4\u4ef6"},"touchablewithoutfeedback":{"id":"touchablewithoutfeedback","title":"TouchableWithoutFeedback","description":"If you\'re looking for a more extensive and future-proof way to handle touch-based input, check out the Pressable API.","sidebar":"\u7ec4\u4ef6"},"transforms":{"id":"transforms","title":"\u53d8\u6362\uff08Transform\uff09","description":"\u53d8\u6362\uff08Transform\uff09\u662f\u6837\u5f0f\u5c5e\u6027\uff0c\u53ef\u5e2e\u52a9\u60a8\u4f7f\u7528 2D \u6216 3D \u53d8\u6362\u4fee\u6539\u7ec4\u4ef6\u7684\u5916\u89c2\u548c\u4f4d\u7f6e\u3002\u7136\u800c\uff0c\u5373\u4fbf\u4f7f\u7528\u4e86\u53d8\u6362\uff0c\u4f7f\u7528\u53d8\u6362\u7684\u7ec4\u4ef6\u7684\u5e03\u5c40\u5e76\u4e0d\u4f1a\u53d8\u5316\uff0c\u56e0\u6b64\u53ef\u80fd\u4f1a\u4e0e\u9644\u8fd1\u7684\u7ec4\u4ef6\u91cd\u53e0\u3002\u60a8\u53ef\u4ee5\u5bf9\u53d8\u6362\u7684\u7ec4\u4ef6\u3001\u9644\u8fd1\u7684\u7ec4\u4ef6\u5e94\u7528\u8fb9\u8ddd\uff0c\u6216\u5bf9\u5bb9\u5668\u5e94\u7528\u586b\u5145\uff0c\u4ee5\u9632\u6b62\u8fd9\u79cd\u91cd\u53e0\u3002","sidebar":"api"},"troubleshooting":{"id":"troubleshooting","title":"Troubleshooting","description":"These are some common issues you may run into while setting up React Native. If you encounter something that is not listed here, try searching for the issue in GitHub."},"turbo-native-modules-android":{"id":"turbo-native-modules-android","title":"Turbo \u539f\u751f\u6a21\u5757\uff1aAndroid","description":"\u73b0\u5728\u6211\u4eec\u6765\u7f16\u5199\u4e00\u4e9b Android \u5e73\u53f0\u4ee3\u7801\uff0c\u4ee5\u786e\u4fdd localStorage \u5728\u5e94\u7528\u5173\u95ed\u540e\u4ecd\u7136\u53ef\u4ee5\u6301\u4e45\u4fdd\u5b58\u6570\u636e\u3002"},"turbo-native-modules-introduction":{"id":"turbo-native-modules-introduction","title":"Turbo \u539f\u751f\u6a21\u5757\u4ecb\u7ecd","description":"\u4f60\u7684 React Native \u5e94\u7528\u4ee3\u7801\u53ef\u80fd\u9700\u8981\u4e0e React Native \u6216\u73b0\u6709\u5e93\u672a\u63d0\u4f9b\u7684\u539f\u751f\u5e73\u53f0 API \u8fdb\u884c\u4ea4\u4e92\u3002\u4f60\u53ef\u4ee5\u4f7f\u7528 Turbo \u539f\u751f\u6a21\u5757 \u81ea\u5df1\u7f16\u5199\u96c6\u6210\u4ee3\u7801\u3002\u672c\u6307\u5357\u5c06\u5411\u4f60\u5c55\u793a\u5982\u4f55\u7f16\u5199\u4e00\u4e2a\u3002","sidebar":"docs"},"turbo-native-modules-ios":{"id":"turbo-native-modules-ios","title":"Turbo \u539f\u751f\u6a21\u5757\uff1aiOS","description":"\u73b0\u5728\u6211\u4eec\u6765\u7f16\u5199\u4e00\u4e9b iOS \u5e73\u53f0\u4ee3\u7801\uff0c\u4ee5\u786e\u4fdd localStorage \u5728\u5e94\u7528\u5173\u95ed\u540e\u4ecd\u7136\u53ef\u4ee5\u6301\u4e45\u4fdd\u5b58\u6570\u636e\u3002"},"tutorial":{"id":"tutorial","title":"\u793a\u4f8b\u6559\u7a0b\uff1aHello World","description":"React Native \u770b\u8d77\u6765\u5f88\u50cf React\uff0c\u53ea\u4e0d\u8fc7\u5176\u57fa\u7840\u7ec4\u4ef6\u662f\u539f\u751f\u7ec4\u4ef6\u800c\u975e web \u7ec4\u4ef6\u3002\u8981\u7406\u89e3 React Native \u5e94\u7528\u7684\u57fa\u672c\u7ed3\u6784\uff0c\u9996\u5148\u9700\u8981\u4e86\u89e3\u4e00\u4e9b\u57fa\u672c\u7684 React \u7684\u6982\u5ff5\uff0c\u6bd4\u5982 JSX \u8bed\u6cd5\u3001\u7ec4\u4ef6\u3001state\u72b6\u6001\u4ee5\u53caprops\u5c5e\u6027\u3002\u5982\u679c\u4f60\u5df2\u7ecf\u4e86\u89e3\u4e86 React\uff0c\u90a3\u4e48\u8fd8\u9700\u8981\u638c\u63e1\u4e00\u4e9b React Native \u7279\u6709\u7684\u77e5\u8bc6\uff0c\u6bd4\u5982\u539f\u751f\u7ec4\u4ef6\u7684\u4f7f\u7528\u3002\u8fd9\u7bc7\u6559\u7a0b\u53ef\u4ee5\u4f9b\u4efb\u4f55\u57fa\u7840\u7684\u8bfb\u8005\u5b66\u4e60\uff0c\u4e0d\u7ba1\u4f60\u662f\u5426\u6709 React \u65b9\u9762\u7684\u7ecf\u9a8c\u3002"},"typescript":{"id":"typescript","title":"\u4f7f\u7528 TypeScript","description":"TypeScript \u662f\u4e00\u79cd\u901a\u8fc7\u6dfb\u52a0\u7c7b\u578b\u5b9a\u4e49\u6765\u6269\u5c55 JavaScript \u7684\u8bed\u8a00\u3002\u65b0\u7684 React Native \u9879\u76ee\u9ed8\u8ba4\u4ee5 TypeScript \u4e3a\u76ee\u6807\uff0c\u540c\u65f6\u4e5f\u652f\u6301 JavaScript \u548c Flow\u3002","sidebar":"docs"},"upgrading":{"id":"upgrading","title":"\u66f4\u65b0","description":"\u65f6\u523b\u5c06 React Native \u66f4\u65b0\u5230\u6700\u65b0\u7684\u7248\u672c\uff0c\u53ef\u4ee5\u83b7\u5f97\u66f4\u591a API\u3001\u89c6\u56fe\u3001\u5f00\u53d1\u8005\u5de5\u5177\u4ee5\u53ca\u5176\u4ed6\u4e00\u4e9b\u597d\u4e1c\u897f\uff08\u8bd1\u6ce8\uff1a\u5b98\u65b9\u5f00\u53d1\u4efb\u52a1\u7e41\u91cd\uff0c\u4eba\u624b\u7d27\u7f3a\uff0c\u51e0\u4e4e\u4e0d\u4f1a\u5bf9\u65e7\u7248\u672c\u63d0\u4f9b\u7ef4\u62a4\u652f\u6301\uff0c\u6240\u4ee5\u5373\u4fbf\u66f4\u65b0\u53ef\u80fd\u5e26\u6765\u4e00\u4e9b\u517c\u5bb9\u4e0a\u7684\u53d8\u66f4\uff0c\u4f46\u5efa\u8bae\u5f00\u53d1\u8005\u8fd8\u662f\u5c3d\u4e00\u5207\u53ef\u80fd\u7b2c\u4e00\u65f6\u95f4\u66f4\u65b0\uff09\u3002\u7531\u4e8e\u4e00\u4e2a\u5b8c\u6574\u7684 React Native \u9879\u76ee\u662f\u7531 Android \u9879\u76ee\u3001iOS \u9879\u76ee\u548c JavaScript \u9879\u76ee\u7ec4\u6210\u7684\uff0c\u4e14\u90fd\u6253\u5305\u5728\u4e00\u4e2a npm \u5305\u4e2d\uff0c\u6240\u4ee5\u5347\u7ea7\u53ef\u80fd\u4f1a\u6709\u4e00\u4e9b\u9ebb\u70e6\u3002\u6211\u4eec\u4f1a\u5c3d\u91cf\u7b80\u5316\u8fd9\u4e00\u6d41\u7a0b\u3002\u4f60\u53ef\u4ee5\u5728\u9879\u76ee\u76ee\u5f55\u4e0b\u4f7f\u7528npx react-native info\u547d\u4ee4\u67e5\u770b\u5f53\u524d\u7684\u7248\u672c\u3002","sidebar":"docs"},"usecolorscheme":{"id":"usecolorscheme","title":"useColorScheme","description":"useColorScheme \u8fd9\u4e2aReact hook \u63d0\u4f9b\u5e76\u8ba2\u9605\u6765\u81eaAppearance\u6a21\u5757\u7684\u989c\u8272\u65b9\u6848\u66f4\u65b0\u3002\u8fd4\u56de\u503c\u8868\u793a\u5f53\u524d\u7528\u6237\u9996\u9009\u7684\u989c\u8272\u65b9\u6848\u3002\u8be5\u503c\u53ef\u4ee5\u7a0d\u540e\u901a\u8fc7\u76f4\u63a5\u7528\u6237\u52a8\u4f5c\uff08\u4f8b\u5982\uff0c\u8bbe\u5907\u8bbe\u7f6e\u4e2d\u7684\u4e3b\u9898\u9009\u62e9\uff09\u6216\u6839\u636e\u65f6\u95f4\u8868\uff08\u4f8b\u5982\uff0c\u9075\u5faa\u767d\u5929/\u591c\u665a\u5468\u671f\u7684\u4eae\u4e3b\u9898\u548c\u6697\u4e3b\u9898\uff09\u6765\u66f4\u65b0\u3002","sidebar":"api"},"usewindowdimensions":{"id":"usewindowdimensions","title":"useWindowDimensions","description":"useWindowDimensions\u4f1a\u5728\u5c4f\u5e55\u5c3a\u5bf8\u53d8\u5316\u65f6\u81ea\u52a8\u66f4\u65b0\u83b7\u53d6\u5230\u7684\u8bbe\u5907width\u548cheight\u503c\u3002\u4f7f\u7528\u65b9\u6cd5\u5982\u4e0b\uff1a","sidebar":"api"},"using-a-listview":{"id":"using-a-listview","title":"\u4f7f\u7528\u957f\u5217\u8868","description":"React Native \u63d0\u4f9b\u4e86\u51e0\u4e2a\u9002\u7528\u4e8e\u5c55\u793a\u957f\u5217\u8868\u6570\u636e\u7684\u7ec4\u4ef6\uff0c\u4e00\u822c\u800c\u8a00\u6211\u4eec\u4f1a\u9009\u7528FlatList\u6216\u662fSectionList\u3002","sidebar":"docs"},"using-a-scrollview":{"id":"using-a-scrollview","title":"\u4f7f\u7528\u6eda\u52a8\u89c6\u56fe","description":"ScrollView\u662f\u4e00\u4e2a\u901a\u7528\u7684\u53ef\u6eda\u52a8\u7684\u5bb9\u5668\uff0c\u4f60\u53ef\u4ee5\u5728\u5176\u4e2d\u653e\u5165\u591a\u4e2a\u7ec4\u4ef6\u548c\u89c6\u56fe\uff0c\u800c\u4e14\u8fd9\u4e9b\u7ec4\u4ef6\u5e76\u4e0d\u9700\u8981\u662f\u540c\u7c7b\u578b\u7684\u3002ScrollView \u4e0d\u4ec5\u53ef\u4ee5\u5782\u76f4\u6eda\u52a8\uff0c\u8fd8\u80fd\u6c34\u5e73\u6eda\u52a8\uff08\u901a\u8fc7horizontal\u5c5e\u6027\u6765\u8bbe\u7f6e\uff09\u3002","sidebar":"docs"},"vibration":{"id":"vibration","title":"Vibration","description":"\u4f7f\u8bbe\u5907\u632f\u52a8\u3002","sidebar":"api"},"view":{"id":"view","title":"View","description":"\u4f5c\u4e3a\u521b\u5efa UI \u65f6\u6700\u57fa\u7840\u7684\u7ec4\u4ef6\uff0cView \u662f\u4e00\u4e2a\u652f\u6301 Flexbox \u5e03\u5c40\u3001\u6837\u5f0f\u3001\u89e6\u6478\u54cd\u5e94\u3001\u548c\u4e00\u4e9b\u65e0\u969c\u788d\u529f\u80fd\u7684\u5bb9\u5668\u3002\u4e0d\u8bba\u5728\u4ec0\u4e48\u5e73\u53f0\u4e0a\uff0cView \u90fd\u76f4\u63a5\u5bf9\u5e94\u5f53\u524d\u5e73\u53f0\u7684\u539f\u751f\u89c6\u56fe\uff0c\u65e0\u8bba\u5b83\u662f UIView\u3001div \u8fd8\u662f android.view.View\u3002","sidebar":"\u7ec4\u4ef6"},"view-flattening":{"id":"view-flattening","title":"\u89c6\u56fe\u62cd\u5e73","description":"This document refers to the architecture of the new renderer, Fabric, that is in active roll-out."},"view-style-props":{"id":"view-style-props","title":"View \u6837\u5f0f\u5c5e\u6027","description":"\u793a\u4f8b","sidebar":"\u7ec4\u4ef6"},"viewpagerandroid":{"id":"viewpagerandroid","title":"\ud83d\udea7 ViewPagerAndroid","description":"\u5df2\u8fc7\u65f6\u3002 Use @react-native-community/viewpager instead."},"viewtoken":{"id":"viewtoken","title":"ViewToken \u5bf9\u8c61","description":"ViewToken object is returned as one of properties in the onViewableItemsChanged callback, for example in FlatList component. It is exported by ViewabilityHelper.js.","sidebar":"\u7ec4\u4ef6"},"virtualizedlist":{"id":"virtualizedlist","title":"VirtualizedList","description":"FlatList\u548cSectionList\u7684\u5e95\u5c42\u5b9e\u73b0\u3002FlatList \u548c SectionList \u4f7f\u7528\u8d77\u6765\u66f4\u65b9\u4fbf\uff0c\u540c\u65f6\u4e5f\u6709\u76f8\u5bf9\u66f4\u8be6\u7ec6\u7684\u6587\u6863\u3002\u4e00\u822c\u6765\u8bf4\uff0c\u4ec5\u5f53\u60f3\u83b7\u5f97\u6bd4 FlatList \u66f4\u9ad8\u7684\u7075\u6d3b\u6027\uff08\u6bd4\u5982\u8bf4\u5728\u4f7f\u7528 immutable data \u800c\u4e0d\u662f \u666e\u901a\u6570\u7ec4\uff09\u7684\u65f6\u5019\uff0c\u4f60\u624d\u5e94\u8be5\u8003\u8651\u4f7f\u7528 VirtualizedList\u3002","sidebar":"\u7ec4\u4ef6"},"xplat-implementation":{"id":"xplat-implementation","title":"\u8de8\u5e73\u53f0\u7684\u5b9e\u73b0","description":"This document refers to the architecture of the new renderer, Fabric, that is in active roll-out."}}}}')}}]); \ No newline at end of file diff --git a/assets/js/2003fdf9.d93a0f43.js b/assets/js/2003fdf9.5e2724b0.js similarity index 66% rename from assets/js/2003fdf9.d93a0f43.js rename to assets/js/2003fdf9.5e2724b0.js index 69272dfea00..7dcc9395041 100644 --- a/assets/js/2003fdf9.d93a0f43.js +++ b/assets/js/2003fdf9.5e2724b0.js @@ -1 +1 @@ -"use strict";(self.webpackChunkreact_native_website=self.webpackChunkreact_native_website||[]).push([[32243,84827,86464],{78154:(e,n,t)=>{t.r(n),t.d(n,{assets:()=>p,contentTitle:()=>d,default:()=>m,frontMatter:()=>s,metadata:()=>l,toc:()=>u});var i=t(62540),a=t(43023),r=t(44067),o=t(49646),c=t(64034);const s={id:"fabric-native-components-android",title:"Fabric Native Modules: Android"},d=void 0,l={id:"fabric-native-components-android",title:"Fabric Native Modules: Android",description:"\u73b0\u5728\uff0c\u662f\u65f6\u5019\u7f16\u5199\u4e00\u4e9b Android \u5e73\u53f0\u4ee3\u7801\uff0c\u4ee5\u4fbf\u80fd\u591f\u6e32\u67d3 web \u89c6\u56fe\u3002\u4ee5\u4e0b\u662f\u9700\u8981\u7684\u6b65\u9aa4\uff1a",source:"@site/../cndocs/fabric-native-components-android.md",sourceDirName:".",slug:"/fabric-native-components-android",permalink:"/docs/next/fabric-native-components-android",draft:!1,unlisted:!1,editUrl:"https://github.com/reactnativecn/react-native-website/blob/production/cnwebsite/../cndocs/fabric-native-components-android.md",tags:[],version:"current",frontMatter:{id:"fabric-native-components-android",title:"Fabric Native Modules: Android"}},p={},u=[{value:"1. \u4f7f\u7528 Gradle \u8fd0\u884c Codegen",id:"1-\u4f7f\u7528-gradle-\u8fd0\u884c-codegen",level:3},{value:"2. \u7f16\u5199ReactWebView
",id:"2-\u7f16\u5199-reactwebview",level:3},{value:"3. Write the WebViewManager
",id:"3-write-the-webviewmanager",level:3},{value:"4. Write the ReactWebViewPackage
",id:"4-write-the-reactwebviewpackage",level:3},{value:"5. Register the ReactWebViewPackage
in the application",id:"5-register-the-reactwebviewpackage-in-the-application",level:3}];function h(e){const n={code:"code",h3:"h3",li:"li",p:"p",pre:"pre",ul:"ul",...(0,a.R)(),...e.components};return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(n.p,{children:"\u73b0\u5728\uff0c\u662f\u65f6\u5019\u7f16\u5199\u4e00\u4e9b Android \u5e73\u53f0\u4ee3\u7801\uff0c\u4ee5\u4fbf\u80fd\u591f\u6e32\u67d3 web \u89c6\u56fe\u3002\u4ee5\u4e0b\u662f\u9700\u8981\u7684\u6b65\u9aa4\uff1a"}),"\n",(0,i.jsxs)(n.ul,{children:["\n",(0,i.jsx)(n.li,{children:"\u8fd0\u884c Codegen"}),"\n",(0,i.jsxs)(n.li,{children:["\u7f16\u5199 ",(0,i.jsx)(n.code,{children:"ReactWebView"})," \u7684\u4ee3\u7801"]}),"\n",(0,i.jsxs)(n.li,{children:["\u7f16\u5199 ",(0,i.jsx)(n.code,{children:"ReactWebViewManager"})," \u7684\u4ee3\u7801"]}),"\n",(0,i.jsxs)(n.li,{children:["\u7f16\u5199 ",(0,i.jsx)(n.code,{children:"ReactWebViewPackage"})," \u7684\u4ee3\u7801"]}),"\n",(0,i.jsxs)(n.li,{children:["\u5728\u5e94\u7528\u4e2d\u6ce8\u518c ",(0,i.jsx)(n.code,{children:"ReactWebViewPackage"})]}),"\n"]}),"\n",(0,i.jsx)(n.h3,{id:"1-\u4f7f\u7528-gradle-\u8fd0\u884c-codegen",children:"1. \u4f7f\u7528 Gradle \u8fd0\u884c Codegen"}),"\n",(0,i.jsx)(n.p,{children:"\u8fd0\u884c\u4e00\u6b21\u4ee5\u751f\u6210\u4f60\u7684 IDE \u53ef\u4ee5\u4f7f\u7528\u7684\u6837\u677f\u4ee3\u7801\u3002"}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-bash",metastring:'title="Demo/"',children:"cd android\n./gradlew generateCodegenArtifactsFromSchema\n"})}),"\n",(0,i.jsxs)(n.p,{children:["Codegen \u5c06\u751f\u6210\u4f60\u9700\u8981\u5b9e\u73b0 ",(0,i.jsx)(n.code,{children:"ViewManager"})," \u63a5\u53e3\u548c ",(0,i.jsx)(n.code,{children:"ViewManager"})," \u59d4\u6258\u7684 web \u89c6\u56fe\u3002"]}),"\n",(0,i.jsxs)(n.h3,{id:"2-\u7f16\u5199-reactwebview",children:["2. \u7f16\u5199 ",(0,i.jsx)(n.code,{children:"ReactWebView"})]}),"\n",(0,i.jsxs)(n.p,{children:[(0,i.jsx)(n.code,{children:"ReactWebView"})," \u662f\u5305\u88c5 Android \u539f\u751f\u89c6\u56fe\u7684\u7ec4\u4ef6\uff0cReact Native \u5c06\u5728\u4f7f\u7528\u81ea\u5b9a\u4e49\u7ec4\u4ef6\u65f6\u6e32\u67d3\u5b83\u3002"]}),"\n",(0,i.jsxs)(n.p,{children:["\u5728 ",(0,i.jsx)(n.code,{children:"android/src/main/java/com/webview"})," \u6587\u4ef6\u5939\u4e2d\u521b\u5efa\u4e00\u4e2a ",(0,i.jsx)(n.code,{children:"ReactWebView.java"})," \u6216 ",(0,i.jsx)(n.code,{children:"ReactWebView.kt"})," \u6587\u4ef6\uff0c\u5e76\u4f7f\u7528\u4ee5\u4e0b\u4ee3\u7801\uff1a"]}),"\n",(0,i.jsxs)(r.A,{groupId:"android-language",queryString:!0,defaultValue:c.A.defaultAndroidLanguage,values:c.A.androidLanguages,children:[(0,i.jsx)(o.A,{value:"java",children:(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-java",metastring:'title="Demo/android/src/main/java/com/webview/ReactWebView.java"',children:'package com.webview;\n\nimport android.content.Context;\nimport android.util.AttributeSet;\nimport android.webkit.WebView;\nimport android.webkit.WebViewClient;\n\nimport com.facebook.react.bridge.Arguments;\nimport com.facebook.react.bridge.WritableMap;\nimport com.facebook.react.bridge.ReactContext;\nimport com.facebook.react.uimanager.UIManagerHelper;\nimport com.facebook.react.uimanager.events.Event;\n\npublic class ReactWebView extends WebView {\n public ReactWebView(Context context) {\n super(context);\n configureComponent();\n }\n\n public ReactWebView(Context context, AttributeSet attrs) {\n super(context, attrs);\n configureComponent();\n }\n\n public ReactWebView(Context context, AttributeSet attrs, int defStyleAttr) {\n super(context, attrs, defStyleAttr);\n configureComponent();\n }\n\n private void configureComponent() {\n this.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT));\n this.setWebViewClient(new WebViewClient() {\n @Override\n public void onPageFinished(WebView view, String url) {\n emitOnScriptLoaded(OnScriptLoadedEventResult.success);\n }\n });\n }\n\n public void emitOnScriptLoaded(OnScriptLoadedEventResult result) {\n ReactContext reactContext = (ReactContext) context;\n int surfaceId = UIManagerHelper.getSurfaceId(reactContext);\n EventDispatcher eventDispatcher = UIManagerHelper.getEventDispatcherForReactTag(reactContext, getId());\n WritableMap payload = Arguments.createMap();\n payload.putString("result", result.name());\n\n OnScriptLoadedEvent event = new OnScriptLoadedEvent(surfaceId, getId(), payload);\n if (eventDispatcher != null) {\n eventDispatcher.dispatchEvent(event);\n }\n }\n\n public enum OnScriptLoadedEventResult {\n success,\n error\n }\n\n private class OnScriptLoadedEvent extends EventRCTWebView
",id:"3-\u7f16\u5199-rctwebview",level:3},{value:"AppDelegate.mm",id:"appdelegatemm",level:4}];function l(e){const n={a:"a",admonition:"admonition",code:"code",h3:"h3",h4:"h4",li:"li",ol:"ol",p:"p",pre:"pre",strong:"strong",ul:"ul",...(0,a.R)(),...e.components};return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(n.p,{children:"\u73b0\u5728\uff0c\u662f\u65f6\u5019\u7f16\u5199\u4e00\u4e9b iOS \u5e73\u53f0\u4ee3\u7801\uff0c\u4ee5\u4fbf\u80fd\u591f\u6e32\u67d3 web \u89c6\u56fe\u3002\u4ee5\u4e0b\u662f\u9700\u8981\u7684\u6b65\u9aa4\uff1a"}),"\n",(0,i.jsxs)(n.ul,{children:["\n",(0,i.jsx)(n.li,{children:"\u8fd0\u884c Codegen\u3002"}),"\n",(0,i.jsxs)(n.li,{children:["\u7f16\u5199 ",(0,i.jsx)(n.code,{children:"RCTWebView"})," \u7684\u4ee3\u7801"]}),"\n",(0,i.jsxs)(n.li,{children:["\u5728\u5e94\u7528\u4e2d\u6ce8\u518c ",(0,i.jsx)(n.code,{children:"RCTWebView"})]}),"\n"]}),"\n",(0,i.jsx)(n.h3,{id:"1-\u8fd0\u884c-codegen",children:"1. \u8fd0\u884c Codegen"}),"\n",(0,i.jsxs)(n.p,{children:["\u4f60\u53ef\u4ee5",(0,i.jsx)(n.a,{href:"the-new-architecture/codegen-cli",children:"\u624b\u52a8\u8fd0\u884c"})," Codegen\uff0c\u5f53\u7136\u76f4\u63a5\u4f7f\u7528\u4f60\u5c06\u8981\u6f14\u793a\u7ec4\u4ef6\u7684\u5e94\u7528\u6765\u5b8c\u6210\u6b64\u64cd\u4f5c\u4f1a\u66f4\u7b80\u5355\u3002"]}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-bash",children:"cd ios\nbundle install\nbundle exec pod install\n"})}),"\n",(0,i.jsx)(n.p,{children:"\u91cd\u8981\u7684\u662f\u4f60\u4f1a\u770b\u5230 Codegen \u7684\u65e5\u5fd7\u8f93\u51fa\uff0c\u6211\u4eec\u5c06\u5728 Xcode \u4e2d\u4f7f\u7528\u5b83\u6765\u6784\u5efa WebView \u539f\u751f\u7ec4\u4ef6\u3002"}),"\n",(0,i.jsx)(n.admonition,{type:"warning",children:(0,i.jsxs)(n.p,{children:["\u6ce8\u610f\u4e0d\u8981\u5c06\u751f\u6210\u7684\u4ee3\u7801\u63d0\u4ea4\u5230\u4f60\u7684\u4ed3\u5e93\u4e2d\u3002\u751f\u6210\u7684\u4ee3\u7801\u4e0e React Native \u7684\u7248\u672c\u76f8\u5173\u3002\u4f7f\u7528 npm ",(0,i.jsx)(n.a,{href:"https://nodejs.org/en/blog/npm/peer-dependencies",children:"peerDependencies"})," \u6765\u7ea6\u675f\u4e0e React Native \u7248\u672c\u7684\u517c\u5bb9\u6027\u3002"]})}),"\n",(0,i.jsxs)(n.h3,{id:"3-\u7f16\u5199-rctwebview",children:["3. \u7f16\u5199 ",(0,i.jsx)(n.code,{children:"RCTWebView"})]}),"\n",(0,i.jsxs)(n.p,{children:["\u6211\u4eec\u9700\u8981\u4f7f\u7528 Xcode \u5b8c\u6210\u4ee5\u4e0b ",(0,i.jsx)(n.strong,{children:"5 \u6b65"}),"\uff1a"]}),"\n",(0,i.jsxs)(n.ol,{children:["\n",(0,i.jsx)(n.li,{children:"\u6253\u5f00 CocoPods \u751f\u6210\u7684 Xcode workspace \u6587\u4ef6\uff1a"}),"\n"]}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-bash",children:"cd ios\nopen Demo.xcworkspace\n"})}),"\n",(0,i.jsx)("img",{class:"half-size",alt:"Open Xcode Workspace",src:"/docs/assets/fabric-native-components/1.webp"}),"\n",(0,i.jsxs)(n.ol,{start:"2",children:["\n",(0,i.jsxs)(n.li,{children:["\u53f3\u952e\u70b9\u51fb\u5e94\u7528\uff0c\u9009\u62e9 ",(0,i.jsx)("code",{children:"New Group"}),"\uff0c\u5c06\u65b0\u7ec4\u547d\u540d\u4e3a ",(0,i.jsx)(n.code,{children:"WebView"}),"\u3002"]}),"\n"]}),"\n",(0,i.jsx)("img",{class:"half-size",alt:"Right click on app and select New Group",src:"/docs/assets/fabric-native-components/2.webp"}),"\n",(0,i.jsxs)(n.ol,{start:"3",children:["\n",(0,i.jsxs)(n.li,{children:["\u5728 ",(0,i.jsx)(n.code,{children:"WebView"})," \u7ec4\u4e2d\uff0c\u521b\u5efa ",(0,i.jsx)("code",{children:"New"}),"\u2192",(0,i.jsx)("code",{children:"File from Template"}),"\u3002"]}),"\n"]}),"\n",(0,i.jsx)("img",{class:"half-size",alt:"Create a new file using the Cocoa Touch Classs template",src:"/docs/assets/fabric-native-components/3.webp"}),"\n",(0,i.jsxs)(n.ol,{start:"4",children:["\n",(0,i.jsxs)(n.li,{children:["\u4f7f\u7528 ",(0,i.jsx)("code",{children:"Objective-C File"})," \u6a21\u677f\uff0c\u5e76\u547d\u540d\u4e3a ",(0,i.jsx)("code",{children:"RCTWebView"}),"\u3002"]}),"\n"]}),"\n",(0,i.jsx)("img",{class:"half-size",alt:"Create an Objective-C RCTWebView class",src:"/docs/assets/fabric-native-components/4.webp"}),"\n",(0,i.jsxs)(n.ol,{start:"5",children:["\n",(0,i.jsxs)(n.li,{children:["\u5c06 ",(0,i.jsx)("code",{children:"RCTWebView.m"})," \u91cd\u547d\u540d\u4e3a ",(0,i.jsx)("code",{children:"RCTWebView.mm"}),"\uff0c\u4f7f\u5176\u6210\u4e3a Objective-C++ \u6587\u4ef6\u3002"]}),"\n"]}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-text",metastring:'title="Demo/ios"',children:"Podfile\n...\nDemo\n\u251c\u2500\u2500 AppDelegate.h\n\u251c\u2500\u2500 AppDelegate.mm\n...\n// highlight-start\n\u251c\u2500\u2500 RCTWebView.h\n\u251c\u2500\u2500 RCTWebView.mm\n// highlight-end\n\u2514\u2500\u2500 main.m\n"})}),"\n",(0,i.jsx)(n.p,{children:"\u521b\u5efa\u5934\u6587\u4ef6\u548c\u5b9e\u73b0\u6587\u4ef6\u540e\uff0c\u53ef\u4ee5\u5f00\u59cb\u5b9e\u73b0\u5b83\u4eec\u3002"}),"\n",(0,i.jsxs)(n.p,{children:["\u4ee5\u4e0b\u662f ",(0,i.jsx)(n.code,{children:"RCTWebView.h"})," \u6587\u4ef6\u7684\u4ee3\u7801\uff0c\u58f0\u660e\u4e86\u7ec4\u4ef6\u63a5\u53e3\u3002"]}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-objc",metastring:'title="Demo/RCTWebView/RTNWebView.h"',children:"#import ReactWebView
",id:"2-\u7f16\u5199-reactwebview",level:3},{value:"3. Write the WebViewManager
",id:"3-write-the-webviewmanager",level:3},{value:"4. Write the ReactWebViewPackage
",id:"4-write-the-reactwebviewpackage",level:3},{value:"5. Register the ReactWebViewPackage
in the application",id:"5-register-the-reactwebviewpackage-in-the-application",level:3}];function h(e){const n={code:"code",h3:"h3",li:"li",p:"p",pre:"pre",ul:"ul",...(0,a.R)(),...e.components};return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(n.p,{children:"\u73b0\u5728\uff0c\u662f\u65f6\u5019\u7f16\u5199\u4e00\u4e9b Android \u5e73\u53f0\u4ee3\u7801\uff0c\u4ee5\u4fbf\u80fd\u591f\u6e32\u67d3 web \u89c6\u56fe\u3002\u4ee5\u4e0b\u662f\u9700\u8981\u7684\u6b65\u9aa4\uff1a"}),"\n",(0,i.jsxs)(n.ul,{children:["\n",(0,i.jsx)(n.li,{children:"\u8fd0\u884c Codegen"}),"\n",(0,i.jsxs)(n.li,{children:["\u7f16\u5199 ",(0,i.jsx)(n.code,{children:"ReactWebView"})," \u7684\u4ee3\u7801"]}),"\n",(0,i.jsxs)(n.li,{children:["\u7f16\u5199 ",(0,i.jsx)(n.code,{children:"ReactWebViewManager"})," \u7684\u4ee3\u7801"]}),"\n",(0,i.jsxs)(n.li,{children:["\u7f16\u5199 ",(0,i.jsx)(n.code,{children:"ReactWebViewPackage"})," \u7684\u4ee3\u7801"]}),"\n",(0,i.jsxs)(n.li,{children:["\u5728\u5e94\u7528\u4e2d\u6ce8\u518c ",(0,i.jsx)(n.code,{children:"ReactWebViewPackage"})]}),"\n"]}),"\n",(0,i.jsx)(n.h3,{id:"1-\u4f7f\u7528-gradle-\u8fd0\u884c-codegen",children:"1. \u4f7f\u7528 Gradle \u8fd0\u884c Codegen"}),"\n",(0,i.jsx)(n.p,{children:"\u8fd0\u884c\u4e00\u6b21\u4ee5\u751f\u6210\u4f60\u7684 IDE \u53ef\u4ee5\u4f7f\u7528\u7684\u6837\u677f\u4ee3\u7801\u3002"}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-bash",metastring:'title="Demo/"',children:"cd android\n./gradlew generateCodegenArtifactsFromSchema\n"})}),"\n",(0,i.jsxs)(n.p,{children:["Codegen \u5c06\u751f\u6210\u4f60\u9700\u8981\u5b9e\u73b0 ",(0,i.jsx)(n.code,{children:"ViewManager"})," \u63a5\u53e3\u548c ",(0,i.jsx)(n.code,{children:"ViewManager"})," \u59d4\u6258\u7684 web \u89c6\u56fe\u3002"]}),"\n",(0,i.jsxs)(n.h3,{id:"2-\u7f16\u5199-reactwebview",children:["2. \u7f16\u5199 ",(0,i.jsx)(n.code,{children:"ReactWebView"})]}),"\n",(0,i.jsxs)(n.p,{children:[(0,i.jsx)(n.code,{children:"ReactWebView"})," \u662f\u5305\u88c5 Android \u539f\u751f\u89c6\u56fe\u7684\u7ec4\u4ef6\uff0cReact Native \u5c06\u5728\u4f7f\u7528\u81ea\u5b9a\u4e49\u7ec4\u4ef6\u65f6\u6e32\u67d3\u5b83\u3002"]}),"\n",(0,i.jsxs)(n.p,{children:["\u5728 ",(0,i.jsx)(n.code,{children:"android/src/main/java/com/webview"})," \u6587\u4ef6\u5939\u4e2d\u521b\u5efa\u4e00\u4e2a ",(0,i.jsx)(n.code,{children:"ReactWebView.java"})," \u6216 ",(0,i.jsx)(n.code,{children:"ReactWebView.kt"})," \u6587\u4ef6\uff0c\u5e76\u4f7f\u7528\u4ee5\u4e0b\u4ee3\u7801\uff1a"]}),"\n",(0,i.jsxs)(r.A,{groupId:"android-language",queryString:!0,defaultValue:c.A.defaultAndroidLanguage,values:c.A.androidLanguages,children:[(0,i.jsx)(o.A,{value:"java",children:(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-java",metastring:'title="Demo/android/src/main/java/com/webview/ReactWebView.java"',children:'package com.webview;\n\nimport android.content.Context;\nimport android.util.AttributeSet;\nimport android.webkit.WebView;\nimport android.webkit.WebViewClient;\n\nimport com.facebook.react.bridge.Arguments;\nimport com.facebook.react.bridge.WritableMap;\nimport com.facebook.react.bridge.ReactContext;\nimport com.facebook.react.uimanager.UIManagerHelper;\nimport com.facebook.react.uimanager.events.Event;\n\npublic class ReactWebView extends WebView {\n public ReactWebView(Context context) {\n super(context);\n configureComponent();\n }\n\n public ReactWebView(Context context, AttributeSet attrs) {\n super(context, attrs);\n configureComponent();\n }\n\n public ReactWebView(Context context, AttributeSet attrs, int defStyleAttr) {\n super(context, attrs, defStyleAttr);\n configureComponent();\n }\n\n private void configureComponent() {\n this.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT));\n this.setWebViewClient(new WebViewClient() {\n @Override\n public void onPageFinished(WebView view, String url) {\n emitOnScriptLoaded(OnScriptLoadedEventResult.success);\n }\n });\n }\n\n public void emitOnScriptLoaded(OnScriptLoadedEventResult result) {\n ReactContext reactContext = (ReactContext) context;\n int surfaceId = UIManagerHelper.getSurfaceId(reactContext);\n EventDispatcher eventDispatcher = UIManagerHelper.getEventDispatcherForReactTag(reactContext, getId());\n WritableMap payload = Arguments.createMap();\n payload.putString("result", result.name());\n\n OnScriptLoadedEvent event = new OnScriptLoadedEvent(surfaceId, getId(), payload);\n if (eventDispatcher != null) {\n eventDispatcher.dispatchEvent(event);\n }\n }\n\n public enum OnScriptLoadedEventResult {\n success,\n error\n }\n\n private class OnScriptLoadedEvent extends EventRCTWebView
",id:"3-\u7f16\u5199-rctwebview",level:3},{value:"AppDelegate.mm",id:"appdelegatemm",level:4}];function l(e){const n={a:"a",admonition:"admonition",code:"code",h3:"h3",h4:"h4",li:"li",ol:"ol",p:"p",pre:"pre",strong:"strong",ul:"ul",...(0,a.R)(),...e.components};return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(n.p,{children:"\u73b0\u5728\uff0c\u662f\u65f6\u5019\u7f16\u5199\u4e00\u4e9b iOS \u5e73\u53f0\u4ee3\u7801\uff0c\u4ee5\u4fbf\u80fd\u591f\u6e32\u67d3 web \u89c6\u56fe\u3002\u4ee5\u4e0b\u662f\u9700\u8981\u7684\u6b65\u9aa4\uff1a"}),"\n",(0,i.jsxs)(n.ul,{children:["\n",(0,i.jsx)(n.li,{children:"\u8fd0\u884c Codegen\u3002"}),"\n",(0,i.jsxs)(n.li,{children:["\u7f16\u5199 ",(0,i.jsx)(n.code,{children:"RCTWebView"})," \u7684\u4ee3\u7801"]}),"\n",(0,i.jsxs)(n.li,{children:["\u5728\u5e94\u7528\u4e2d\u6ce8\u518c ",(0,i.jsx)(n.code,{children:"RCTWebView"})]}),"\n"]}),"\n",(0,i.jsx)(n.h3,{id:"1-\u8fd0\u884c-codegen",children:"1. \u8fd0\u884c Codegen"}),"\n",(0,i.jsxs)(n.p,{children:["\u4f60\u53ef\u4ee5",(0,i.jsx)(n.a,{href:"the-new-architecture/codegen-cli",children:"\u624b\u52a8\u8fd0\u884c"})," Codegen\uff0c\u5f53\u7136\u76f4\u63a5\u4f7f\u7528\u4f60\u5c06\u8981\u6f14\u793a\u7ec4\u4ef6\u7684\u5e94\u7528\u6765\u5b8c\u6210\u6b64\u64cd\u4f5c\u4f1a\u66f4\u7b80\u5355\u3002"]}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-bash",children:"cd ios\nbundle install\nbundle exec pod install\n"})}),"\n",(0,i.jsx)(n.p,{children:"\u91cd\u8981\u7684\u662f\u4f60\u4f1a\u770b\u5230 Codegen \u7684\u65e5\u5fd7\u8f93\u51fa\uff0c\u6211\u4eec\u5c06\u5728 Xcode \u4e2d\u4f7f\u7528\u5b83\u6765\u6784\u5efa WebView \u539f\u751f\u7ec4\u4ef6\u3002"}),"\n",(0,i.jsx)(n.admonition,{type:"warning",children:(0,i.jsxs)(n.p,{children:["\u6ce8\u610f\u4e0d\u8981\u5c06\u751f\u6210\u7684\u4ee3\u7801\u63d0\u4ea4\u5230\u4f60\u7684\u4ed3\u5e93\u4e2d\u3002\u751f\u6210\u7684\u4ee3\u7801\u4e0e React Native \u7684\u7248\u672c\u76f8\u5173\u3002\u4f7f\u7528 npm ",(0,i.jsx)(n.a,{href:"https://nodejs.org/en/blog/npm/peer-dependencies",children:"peerDependencies"})," \u6765\u7ea6\u675f\u4e0e React Native \u7248\u672c\u7684\u517c\u5bb9\u6027\u3002"]})}),"\n",(0,i.jsxs)(n.h3,{id:"3-\u7f16\u5199-rctwebview",children:["3. \u7f16\u5199 ",(0,i.jsx)(n.code,{children:"RCTWebView"})]}),"\n",(0,i.jsxs)(n.p,{children:["\u6211\u4eec\u9700\u8981\u4f7f\u7528 Xcode \u5b8c\u6210\u4ee5\u4e0b ",(0,i.jsx)(n.strong,{children:"5 \u6b65"}),"\uff1a"]}),"\n",(0,i.jsxs)(n.ol,{children:["\n",(0,i.jsx)(n.li,{children:"\u6253\u5f00 CocoPods \u751f\u6210\u7684 Xcode workspace \u6587\u4ef6\uff1a"}),"\n"]}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-bash",children:"cd ios\nopen Demo.xcworkspace\n"})}),"\n",(0,i.jsx)("img",{class:"half-size",alt:"Open Xcode Workspace",src:"/docs/assets/fabric-native-components/1.webp"}),"\n",(0,i.jsxs)(n.ol,{start:"2",children:["\n",(0,i.jsxs)(n.li,{children:["\u53f3\u952e\u70b9\u51fb\u5e94\u7528\uff0c\u9009\u62e9 ",(0,i.jsx)("code",{children:"New Group"}),"\uff0c\u5c06\u65b0\u7ec4\u547d\u540d\u4e3a ",(0,i.jsx)(n.code,{children:"WebView"}),"\u3002"]}),"\n"]}),"\n",(0,i.jsx)("img",{class:"half-size",alt:"Right click on app and select New Group",src:"/docs/assets/fabric-native-components/2.webp"}),"\n",(0,i.jsxs)(n.ol,{start:"3",children:["\n",(0,i.jsxs)(n.li,{children:["\u5728 ",(0,i.jsx)(n.code,{children:"WebView"})," \u7ec4\u4e2d\uff0c\u521b\u5efa ",(0,i.jsx)("code",{children:"New"}),"\u2192",(0,i.jsx)("code",{children:"File from Template"}),"\u3002"]}),"\n"]}),"\n",(0,i.jsx)("img",{class:"half-size",alt:"Create a new file using the Cocoa Touch Classs template",src:"/docs/assets/fabric-native-components/3.webp"}),"\n",(0,i.jsxs)(n.ol,{start:"4",children:["\n",(0,i.jsxs)(n.li,{children:["\u4f7f\u7528 ",(0,i.jsx)("code",{children:"Objective-C File"})," \u6a21\u677f\uff0c\u5e76\u547d\u540d\u4e3a ",(0,i.jsx)("code",{children:"RCTWebView"}),"\u3002"]}),"\n"]}),"\n",(0,i.jsx)("img",{class:"half-size",alt:"Create an Objective-C RCTWebView class",src:"/docs/assets/fabric-native-components/4.webp"}),"\n",(0,i.jsxs)(n.ol,{start:"5",children:["\n",(0,i.jsxs)(n.li,{children:["\u5c06 ",(0,i.jsx)("code",{children:"RCTWebView.m"})," \u91cd\u547d\u540d\u4e3a ",(0,i.jsx)("code",{children:"RCTWebView.mm"}),"\uff0c\u4f7f\u5176\u6210\u4e3a Objective-C++ \u6587\u4ef6\u3002"]}),"\n"]}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-text",metastring:'title="Demo/ios"',children:"Podfile\n...\nDemo\n\u251c\u2500\u2500 AppDelegate.h\n\u251c\u2500\u2500 AppDelegate.mm\n...\n// highlight-start\n\u251c\u2500\u2500 RCTWebView.h\n\u251c\u2500\u2500 RCTWebView.mm\n// highlight-end\n\u2514\u2500\u2500 main.m\n"})}),"\n",(0,i.jsx)(n.p,{children:"\u521b\u5efa\u5934\u6587\u4ef6\u548c\u5b9e\u73b0\u6587\u4ef6\u540e\uff0c\u53ef\u4ee5\u5f00\u59cb\u5b9e\u73b0\u5b83\u4eec\u3002"}),"\n",(0,i.jsxs)(n.p,{children:["\u4ee5\u4e0b\u662f ",(0,i.jsx)(n.code,{children:"RCTWebView.h"})," \u6587\u4ef6\u7684\u4ee3\u7801\uff0c\u58f0\u660e\u4e86\u7ec4\u4ef6\u63a5\u53e3\u3002"]}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-objc",metastring:'title="Demo/RCTWebView/RTNWebView.h"',children:"#import ReactWebView
",id:"2-\u7f16\u5199-reactwebview",level:3},{value:"3. Write the WebViewManager
",id:"3-write-the-webviewmanager",level:3},{value:"4. Write the ReactWebViewPackage
",id:"4-write-the-reactwebviewpackage",level:3},{value:"5. Register the ReactWebViewPackage
in the application",id:"5-register-the-reactwebviewpackage-in-the-application",level:3}];function h(e){const n={code:"code",h3:"h3",li:"li",p:"p",pre:"pre",ul:"ul",...(0,a.R)(),...e.components};return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(n.p,{children:"\u73b0\u5728\uff0c\u662f\u65f6\u5019\u7f16\u5199\u4e00\u4e9b Android \u5e73\u53f0\u4ee3\u7801\uff0c\u4ee5\u4fbf\u80fd\u591f\u6e32\u67d3 web \u89c6\u56fe\u3002\u4ee5\u4e0b\u662f\u9700\u8981\u7684\u6b65\u9aa4\uff1a"}),"\n",(0,i.jsxs)(n.ul,{children:["\n",(0,i.jsx)(n.li,{children:"\u8fd0\u884c Codegen"}),"\n",(0,i.jsxs)(n.li,{children:["\u7f16\u5199 ",(0,i.jsx)(n.code,{children:"ReactWebView"})," \u7684\u4ee3\u7801"]}),"\n",(0,i.jsxs)(n.li,{children:["\u7f16\u5199 ",(0,i.jsx)(n.code,{children:"ReactWebViewManager"})," \u7684\u4ee3\u7801"]}),"\n",(0,i.jsxs)(n.li,{children:["\u7f16\u5199 ",(0,i.jsx)(n.code,{children:"ReactWebViewPackage"})," \u7684\u4ee3\u7801"]}),"\n",(0,i.jsxs)(n.li,{children:["\u5728\u5e94\u7528\u4e2d\u6ce8\u518c ",(0,i.jsx)(n.code,{children:"ReactWebViewPackage"})]}),"\n"]}),"\n",(0,i.jsx)(n.h3,{id:"1-\u4f7f\u7528-gradle-\u8fd0\u884c-codegen",children:"1. \u4f7f\u7528 Gradle \u8fd0\u884c Codegen"}),"\n",(0,i.jsx)(n.p,{children:"\u8fd0\u884c\u4e00\u6b21\u4ee5\u751f\u6210\u4f60\u7684 IDE \u53ef\u4ee5\u4f7f\u7528\u7684\u6837\u677f\u4ee3\u7801\u3002"}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-bash",metastring:'title="Demo/"',children:"cd android\n./gradlew generateCodegenArtifactsFromSchema\n"})}),"\n",(0,i.jsxs)(n.p,{children:["Codegen \u5c06\u751f\u6210\u4f60\u9700\u8981\u5b9e\u73b0 ",(0,i.jsx)(n.code,{children:"ViewManager"})," \u63a5\u53e3\u548c ",(0,i.jsx)(n.code,{children:"ViewManager"})," \u59d4\u6258\u7684 web \u89c6\u56fe\u3002"]}),"\n",(0,i.jsxs)(n.h3,{id:"2-\u7f16\u5199-reactwebview",children:["2. \u7f16\u5199 ",(0,i.jsx)(n.code,{children:"ReactWebView"})]}),"\n",(0,i.jsxs)(n.p,{children:[(0,i.jsx)(n.code,{children:"ReactWebView"})," \u662f\u5305\u88c5 Android \u539f\u751f\u89c6\u56fe\u7684\u7ec4\u4ef6\uff0cReact Native \u5c06\u5728\u4f7f\u7528\u81ea\u5b9a\u4e49\u7ec4\u4ef6\u65f6\u6e32\u67d3\u5b83\u3002"]}),"\n",(0,i.jsxs)(n.p,{children:["\u5728 ",(0,i.jsx)(n.code,{children:"android/src/main/java/com/webview"})," \u6587\u4ef6\u5939\u4e2d\u521b\u5efa\u4e00\u4e2a ",(0,i.jsx)(n.code,{children:"ReactWebView.java"})," \u6216 ",(0,i.jsx)(n.code,{children:"ReactWebView.kt"})," \u6587\u4ef6\uff0c\u5e76\u4f7f\u7528\u4ee5\u4e0b\u4ee3\u7801\uff1a"]}),"\n",(0,i.jsxs)(r.A,{groupId:"android-language",queryString:!0,defaultValue:c.A.defaultAndroidLanguage,values:c.A.androidLanguages,children:[(0,i.jsx)(o.A,{value:"java",children:(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-java",metastring:'title="Demo/android/src/main/java/com/webview/ReactWebView.java"',children:'package com.webview;\n\nimport android.content.Context;\nimport android.util.AttributeSet;\nimport android.webkit.WebView;\nimport android.webkit.WebViewClient;\n\nimport com.facebook.react.bridge.Arguments;\nimport com.facebook.react.bridge.WritableMap;\nimport com.facebook.react.bridge.ReactContext;\nimport com.facebook.react.uimanager.UIManagerHelper;\nimport com.facebook.react.uimanager.events.Event;\n\npublic class ReactWebView extends WebView {\n public ReactWebView(Context context) {\n super(context);\n configureComponent();\n }\n\n public ReactWebView(Context context, AttributeSet attrs) {\n super(context, attrs);\n configureComponent();\n }\n\n public ReactWebView(Context context, AttributeSet attrs, int defStyleAttr) {\n super(context, attrs, defStyleAttr);\n configureComponent();\n }\n\n private void configureComponent() {\n this.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT));\n this.setWebViewClient(new WebViewClient() {\n @Override\n public void onPageFinished(WebView view, String url) {\n emitOnScriptLoaded(OnScriptLoadedEventResult.success);\n }\n });\n }\n\n public void emitOnScriptLoaded(OnScriptLoadedEventResult result) {\n ReactContext reactContext = (ReactContext) context;\n int surfaceId = UIManagerHelper.getSurfaceId(reactContext);\n EventDispatcher eventDispatcher = UIManagerHelper.getEventDispatcherForReactTag(reactContext, getId());\n WritableMap payload = Arguments.createMap();\n payload.putString("result", result.name());\n\n OnScriptLoadedEvent event = new OnScriptLoadedEvent(surfaceId, getId(), payload);\n if (eventDispatcher != null) {\n eventDispatcher.dispatchEvent(event);\n }\n }\n\n public enum OnScriptLoadedEventResult {\n success,\n error\n }\n\n private class OnScriptLoadedEvent extends EventRCTWebView
",id:"3-\u7f16\u5199-rctwebview",level:3},{value:"AppDelegate.mm",id:"appdelegatemm",level:4}];function l(e){const n={a:"a",admonition:"admonition",code:"code",h3:"h3",h4:"h4",li:"li",ol:"ol",p:"p",pre:"pre",strong:"strong",ul:"ul",...(0,a.R)(),...e.components};return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(n.p,{children:"\u73b0\u5728\uff0c\u662f\u65f6\u5019\u7f16\u5199\u4e00\u4e9b iOS \u5e73\u53f0\u4ee3\u7801\uff0c\u4ee5\u4fbf\u80fd\u591f\u6e32\u67d3 web \u89c6\u56fe\u3002\u4ee5\u4e0b\u662f\u9700\u8981\u7684\u6b65\u9aa4\uff1a"}),"\n",(0,i.jsxs)(n.ul,{children:["\n",(0,i.jsx)(n.li,{children:"\u8fd0\u884c Codegen\u3002"}),"\n",(0,i.jsxs)(n.li,{children:["\u7f16\u5199 ",(0,i.jsx)(n.code,{children:"RCTWebView"})," \u7684\u4ee3\u7801"]}),"\n",(0,i.jsxs)(n.li,{children:["\u5728\u5e94\u7528\u4e2d\u6ce8\u518c ",(0,i.jsx)(n.code,{children:"RCTWebView"})]}),"\n"]}),"\n",(0,i.jsx)(n.h3,{id:"1-\u8fd0\u884c-codegen",children:"1. \u8fd0\u884c Codegen"}),"\n",(0,i.jsxs)(n.p,{children:["\u4f60\u53ef\u4ee5",(0,i.jsx)(n.a,{href:"the-new-architecture/codegen-cli",children:"\u624b\u52a8\u8fd0\u884c"})," Codegen\uff0c\u5f53\u7136\u76f4\u63a5\u4f7f\u7528\u4f60\u5c06\u8981\u6f14\u793a\u7ec4\u4ef6\u7684\u5e94\u7528\u6765\u5b8c\u6210\u6b64\u64cd\u4f5c\u4f1a\u66f4\u7b80\u5355\u3002"]}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-bash",children:"cd ios\nbundle install\nbundle exec pod install\n"})}),"\n",(0,i.jsx)(n.p,{children:"\u91cd\u8981\u7684\u662f\u4f60\u4f1a\u770b\u5230 Codegen \u7684\u65e5\u5fd7\u8f93\u51fa\uff0c\u6211\u4eec\u5c06\u5728 Xcode \u4e2d\u4f7f\u7528\u5b83\u6765\u6784\u5efa WebView \u539f\u751f\u7ec4\u4ef6\u3002"}),"\n",(0,i.jsx)(n.admonition,{type:"warning",children:(0,i.jsxs)(n.p,{children:["\u6ce8\u610f\u4e0d\u8981\u5c06\u751f\u6210\u7684\u4ee3\u7801\u63d0\u4ea4\u5230\u4f60\u7684\u4ed3\u5e93\u4e2d\u3002\u751f\u6210\u7684\u4ee3\u7801\u4e0e React Native \u7684\u7248\u672c\u76f8\u5173\u3002\u4f7f\u7528 npm ",(0,i.jsx)(n.a,{href:"https://nodejs.org/en/blog/npm/peer-dependencies",children:"peerDependencies"})," \u6765\u7ea6\u675f\u4e0e React Native \u7248\u672c\u7684\u517c\u5bb9\u6027\u3002"]})}),"\n",(0,i.jsxs)(n.h3,{id:"3-\u7f16\u5199-rctwebview",children:["3. \u7f16\u5199 ",(0,i.jsx)(n.code,{children:"RCTWebView"})]}),"\n",(0,i.jsxs)(n.p,{children:["\u6211\u4eec\u9700\u8981\u4f7f\u7528 Xcode \u5b8c\u6210\u4ee5\u4e0b ",(0,i.jsx)(n.strong,{children:"5 \u6b65"}),"\uff1a"]}),"\n",(0,i.jsxs)(n.ol,{children:["\n",(0,i.jsx)(n.li,{children:"\u6253\u5f00 CocoPods \u751f\u6210\u7684 Xcode workspace \u6587\u4ef6\uff1a"}),"\n"]}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-bash",children:"cd ios\nopen Demo.xcworkspace\n"})}),"\n",(0,i.jsx)("img",{class:"half-size",alt:"Open Xcode Workspace",src:"/docs/assets/fabric-native-components/1.webp"}),"\n",(0,i.jsxs)(n.ol,{start:"2",children:["\n",(0,i.jsxs)(n.li,{children:["\u53f3\u952e\u70b9\u51fb\u5e94\u7528\uff0c\u9009\u62e9 ",(0,i.jsx)("code",{children:"New Group"}),"\uff0c\u5c06\u65b0\u7ec4\u547d\u540d\u4e3a ",(0,i.jsx)(n.code,{children:"WebView"}),"\u3002"]}),"\n"]}),"\n",(0,i.jsx)("img",{class:"half-size",alt:"Right click on app and select New Group",src:"/docs/assets/fabric-native-components/2.webp"}),"\n",(0,i.jsxs)(n.ol,{start:"3",children:["\n",(0,i.jsxs)(n.li,{children:["\u5728 ",(0,i.jsx)(n.code,{children:"WebView"})," \u7ec4\u4e2d\uff0c\u521b\u5efa ",(0,i.jsx)("code",{children:"New"}),"\u2192",(0,i.jsx)("code",{children:"File from Template"}),"\u3002"]}),"\n"]}),"\n",(0,i.jsx)("img",{class:"half-size",alt:"Create a new file using the Cocoa Touch Classs template",src:"/docs/assets/fabric-native-components/3.webp"}),"\n",(0,i.jsxs)(n.ol,{start:"4",children:["\n",(0,i.jsxs)(n.li,{children:["\u4f7f\u7528 ",(0,i.jsx)("code",{children:"Objective-C File"})," \u6a21\u677f\uff0c\u5e76\u547d\u540d\u4e3a ",(0,i.jsx)("code",{children:"RCTWebView"}),"\u3002"]}),"\n"]}),"\n",(0,i.jsx)("img",{class:"half-size",alt:"Create an Objective-C RCTWebView class",src:"/docs/assets/fabric-native-components/4.webp"}),"\n",(0,i.jsxs)(n.ol,{start:"5",children:["\n",(0,i.jsxs)(n.li,{children:["\u5c06 ",(0,i.jsx)("code",{children:"RCTWebView.m"})," \u91cd\u547d\u540d\u4e3a ",(0,i.jsx)("code",{children:"RCTWebView.mm"}),"\uff0c\u4f7f\u5176\u6210\u4e3a Objective-C++ \u6587\u4ef6\u3002"]}),"\n"]}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-text",metastring:'title="Demo/ios"',children:"Podfile\n...\nDemo\n\u251c\u2500\u2500 AppDelegate.h\n\u251c\u2500\u2500 AppDelegate.mm\n...\n// highlight-start\n\u251c\u2500\u2500 RCTWebView.h\n\u251c\u2500\u2500 RCTWebView.mm\n// highlight-end\n\u2514\u2500\u2500 main.m\n"})}),"\n",(0,i.jsx)(n.p,{children:"\u521b\u5efa\u5934\u6587\u4ef6\u548c\u5b9e\u73b0\u6587\u4ef6\u540e\uff0c\u53ef\u4ee5\u5f00\u59cb\u5b9e\u73b0\u5b83\u4eec\u3002"}),"\n",(0,i.jsxs)(n.p,{children:["\u4ee5\u4e0b\u662f ",(0,i.jsx)(n.code,{children:"RCTWebView.h"})," \u6587\u4ef6\u7684\u4ee3\u7801\uff0c\u58f0\u660e\u4e86\u7ec4\u4ef6\u63a5\u53e3\u3002"]}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-objc",metastring:'title="Demo/RCTWebView/RTNWebView.h"',children:"#import ReactWebView
",id:"2-\u7f16\u5199-reactwebview",level:3},{value:"3. Write the WebViewManager
",id:"3-write-the-webviewmanager",level:3},{value:"4. Write the ReactWebViewPackage
",id:"4-write-the-reactwebviewpackage",level:3},{value:"5. Register the ReactWebViewPackage
in the application",id:"5-register-the-reactwebviewpackage-in-the-application",level:3}];function h(e){const n={code:"code",h3:"h3",li:"li",p:"p",pre:"pre",ul:"ul",...(0,a.R)(),...e.components};return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(n.p,{children:"\u73b0\u5728\uff0c\u662f\u65f6\u5019\u7f16\u5199\u4e00\u4e9b Android \u5e73\u53f0\u4ee3\u7801\uff0c\u4ee5\u4fbf\u80fd\u591f\u6e32\u67d3 web \u89c6\u56fe\u3002\u4ee5\u4e0b\u662f\u9700\u8981\u7684\u6b65\u9aa4\uff1a"}),"\n",(0,i.jsxs)(n.ul,{children:["\n",(0,i.jsx)(n.li,{children:"\u8fd0\u884c Codegen"}),"\n",(0,i.jsxs)(n.li,{children:["\u7f16\u5199 ",(0,i.jsx)(n.code,{children:"ReactWebView"})," \u7684\u4ee3\u7801"]}),"\n",(0,i.jsxs)(n.li,{children:["\u7f16\u5199 ",(0,i.jsx)(n.code,{children:"ReactWebViewManager"})," \u7684\u4ee3\u7801"]}),"\n",(0,i.jsxs)(n.li,{children:["\u7f16\u5199 ",(0,i.jsx)(n.code,{children:"ReactWebViewPackage"})," \u7684\u4ee3\u7801"]}),"\n",(0,i.jsxs)(n.li,{children:["\u5728\u5e94\u7528\u4e2d\u6ce8\u518c ",(0,i.jsx)(n.code,{children:"ReactWebViewPackage"})]}),"\n"]}),"\n",(0,i.jsx)(n.h3,{id:"1-\u4f7f\u7528-gradle-\u8fd0\u884c-codegen",children:"1. \u4f7f\u7528 Gradle \u8fd0\u884c Codegen"}),"\n",(0,i.jsx)(n.p,{children:"\u8fd0\u884c\u4e00\u6b21\u4ee5\u751f\u6210\u4f60\u7684 IDE \u53ef\u4ee5\u4f7f\u7528\u7684\u6837\u677f\u4ee3\u7801\u3002"}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-bash",metastring:'title="Demo/"',children:"cd android\n./gradlew generateCodegenArtifactsFromSchema\n"})}),"\n",(0,i.jsxs)(n.p,{children:["Codegen \u5c06\u751f\u6210\u4f60\u9700\u8981\u5b9e\u73b0 ",(0,i.jsx)(n.code,{children:"ViewManager"})," \u63a5\u53e3\u548c ",(0,i.jsx)(n.code,{children:"ViewManager"})," \u59d4\u6258\u7684 web \u89c6\u56fe\u3002"]}),"\n",(0,i.jsxs)(n.h3,{id:"2-\u7f16\u5199-reactwebview",children:["2. \u7f16\u5199 ",(0,i.jsx)(n.code,{children:"ReactWebView"})]}),"\n",(0,i.jsxs)(n.p,{children:[(0,i.jsx)(n.code,{children:"ReactWebView"})," \u662f\u5305\u88c5 Android \u539f\u751f\u89c6\u56fe\u7684\u7ec4\u4ef6\uff0cReact Native \u5c06\u5728\u4f7f\u7528\u81ea\u5b9a\u4e49\u7ec4\u4ef6\u65f6\u6e32\u67d3\u5b83\u3002"]}),"\n",(0,i.jsxs)(n.p,{children:["\u5728 ",(0,i.jsx)(n.code,{children:"android/src/main/java/com/webview"})," \u6587\u4ef6\u5939\u4e2d\u521b\u5efa\u4e00\u4e2a ",(0,i.jsx)(n.code,{children:"ReactWebView.java"})," \u6216 ",(0,i.jsx)(n.code,{children:"ReactWebView.kt"})," \u6587\u4ef6\uff0c\u5e76\u4f7f\u7528\u4ee5\u4e0b\u4ee3\u7801\uff1a"]}),"\n",(0,i.jsxs)(r.A,{groupId:"android-language",queryString:!0,defaultValue:c.A.defaultAndroidLanguage,values:c.A.androidLanguages,children:[(0,i.jsx)(o.A,{value:"java",children:(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-java",metastring:'title="Demo/android/src/main/java/com/webview/ReactWebView.java"',children:'package com.webview;\n\nimport android.content.Context;\nimport android.util.AttributeSet;\nimport android.webkit.WebView;\nimport android.webkit.WebViewClient;\n\nimport com.facebook.react.bridge.Arguments;\nimport com.facebook.react.bridge.WritableMap;\nimport com.facebook.react.bridge.ReactContext;\nimport com.facebook.react.uimanager.UIManagerHelper;\nimport com.facebook.react.uimanager.events.Event;\n\npublic class ReactWebView extends WebView {\n public ReactWebView(Context context) {\n super(context);\n configureComponent();\n }\n\n public ReactWebView(Context context, AttributeSet attrs) {\n super(context, attrs);\n configureComponent();\n }\n\n public ReactWebView(Context context, AttributeSet attrs, int defStyleAttr) {\n super(context, attrs, defStyleAttr);\n configureComponent();\n }\n\n private void configureComponent() {\n this.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT));\n this.setWebViewClient(new WebViewClient() {\n @Override\n public void onPageFinished(WebView view, String url) {\n emitOnScriptLoaded(OnScriptLoadedEventResult.success);\n }\n });\n }\n\n public void emitOnScriptLoaded(OnScriptLoadedEventResult result) {\n ReactContext reactContext = (ReactContext) context;\n int surfaceId = UIManagerHelper.getSurfaceId(reactContext);\n EventDispatcher eventDispatcher = UIManagerHelper.getEventDispatcherForReactTag(reactContext, getId());\n WritableMap payload = Arguments.createMap();\n payload.putString("result", result.name());\n\n OnScriptLoadedEvent event = new OnScriptLoadedEvent(surfaceId, getId(), payload);\n if (eventDispatcher != null) {\n eventDispatcher.dispatchEvent(event);\n }\n }\n\n public enum OnScriptLoadedEventResult {\n success,\n error\n }\n\n private class OnScriptLoadedEvent extends EventRCTWebView
",id:"3-\u7f16\u5199-rctwebview",level:3},{value:"AppDelegate.mm",id:"appdelegatemm",level:4}];function l(e){const n={a:"a",admonition:"admonition",code:"code",h3:"h3",h4:"h4",li:"li",ol:"ol",p:"p",pre:"pre",strong:"strong",ul:"ul",...(0,a.R)(),...e.components};return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(n.p,{children:"\u73b0\u5728\uff0c\u662f\u65f6\u5019\u7f16\u5199\u4e00\u4e9b iOS \u5e73\u53f0\u4ee3\u7801\uff0c\u4ee5\u4fbf\u80fd\u591f\u6e32\u67d3 web \u89c6\u56fe\u3002\u4ee5\u4e0b\u662f\u9700\u8981\u7684\u6b65\u9aa4\uff1a"}),"\n",(0,i.jsxs)(n.ul,{children:["\n",(0,i.jsx)(n.li,{children:"\u8fd0\u884c Codegen\u3002"}),"\n",(0,i.jsxs)(n.li,{children:["\u7f16\u5199 ",(0,i.jsx)(n.code,{children:"RCTWebView"})," \u7684\u4ee3\u7801"]}),"\n",(0,i.jsxs)(n.li,{children:["\u5728\u5e94\u7528\u4e2d\u6ce8\u518c ",(0,i.jsx)(n.code,{children:"RCTWebView"})]}),"\n"]}),"\n",(0,i.jsx)(n.h3,{id:"1-\u8fd0\u884c-codegen",children:"1. \u8fd0\u884c Codegen"}),"\n",(0,i.jsxs)(n.p,{children:["\u4f60\u53ef\u4ee5",(0,i.jsx)(n.a,{href:"the-new-architecture/codegen-cli",children:"\u624b\u52a8\u8fd0\u884c"})," Codegen\uff0c\u5f53\u7136\u76f4\u63a5\u4f7f\u7528\u4f60\u5c06\u8981\u6f14\u793a\u7ec4\u4ef6\u7684\u5e94\u7528\u6765\u5b8c\u6210\u6b64\u64cd\u4f5c\u4f1a\u66f4\u7b80\u5355\u3002"]}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-bash",children:"cd ios\nbundle install\nbundle exec pod install\n"})}),"\n",(0,i.jsx)(n.p,{children:"\u91cd\u8981\u7684\u662f\u4f60\u4f1a\u770b\u5230 Codegen \u7684\u65e5\u5fd7\u8f93\u51fa\uff0c\u6211\u4eec\u5c06\u5728 Xcode \u4e2d\u4f7f\u7528\u5b83\u6765\u6784\u5efa WebView \u539f\u751f\u7ec4\u4ef6\u3002"}),"\n",(0,i.jsx)(n.admonition,{type:"warning",children:(0,i.jsxs)(n.p,{children:["\u6ce8\u610f\u4e0d\u8981\u5c06\u751f\u6210\u7684\u4ee3\u7801\u63d0\u4ea4\u5230\u4f60\u7684\u4ed3\u5e93\u4e2d\u3002\u751f\u6210\u7684\u4ee3\u7801\u4e0e React Native \u7684\u7248\u672c\u76f8\u5173\u3002\u4f7f\u7528 npm ",(0,i.jsx)(n.a,{href:"https://nodejs.org/en/blog/npm/peer-dependencies",children:"peerDependencies"})," \u6765\u7ea6\u675f\u4e0e React Native \u7248\u672c\u7684\u517c\u5bb9\u6027\u3002"]})}),"\n",(0,i.jsxs)(n.h3,{id:"3-\u7f16\u5199-rctwebview",children:["3. \u7f16\u5199 ",(0,i.jsx)(n.code,{children:"RCTWebView"})]}),"\n",(0,i.jsxs)(n.p,{children:["\u6211\u4eec\u9700\u8981\u4f7f\u7528 Xcode \u5b8c\u6210\u4ee5\u4e0b ",(0,i.jsx)(n.strong,{children:"5 \u6b65"}),"\uff1a"]}),"\n",(0,i.jsxs)(n.ol,{children:["\n",(0,i.jsx)(n.li,{children:"\u6253\u5f00 CocoPods \u751f\u6210\u7684 Xcode workspace \u6587\u4ef6\uff1a"}),"\n"]}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-bash",children:"cd ios\nopen Demo.xcworkspace\n"})}),"\n",(0,i.jsx)("img",{class:"half-size",alt:"Open Xcode Workspace",src:"/docs/assets/fabric-native-components/1.webp"}),"\n",(0,i.jsxs)(n.ol,{start:"2",children:["\n",(0,i.jsxs)(n.li,{children:["\u53f3\u952e\u70b9\u51fb\u5e94\u7528\uff0c\u9009\u62e9 ",(0,i.jsx)("code",{children:"New Group"}),"\uff0c\u5c06\u65b0\u7ec4\u547d\u540d\u4e3a ",(0,i.jsx)(n.code,{children:"WebView"}),"\u3002"]}),"\n"]}),"\n",(0,i.jsx)("img",{class:"half-size",alt:"Right click on app and select New Group",src:"/docs/assets/fabric-native-components/2.webp"}),"\n",(0,i.jsxs)(n.ol,{start:"3",children:["\n",(0,i.jsxs)(n.li,{children:["\u5728 ",(0,i.jsx)(n.code,{children:"WebView"})," \u7ec4\u4e2d\uff0c\u521b\u5efa ",(0,i.jsx)("code",{children:"New"}),"\u2192",(0,i.jsx)("code",{children:"File from Template"}),"\u3002"]}),"\n"]}),"\n",(0,i.jsx)("img",{class:"half-size",alt:"Create a new file using the Cocoa Touch Classs template",src:"/docs/assets/fabric-native-components/3.webp"}),"\n",(0,i.jsxs)(n.ol,{start:"4",children:["\n",(0,i.jsxs)(n.li,{children:["\u4f7f\u7528 ",(0,i.jsx)("code",{children:"Objective-C File"})," \u6a21\u677f\uff0c\u5e76\u547d\u540d\u4e3a ",(0,i.jsx)("code",{children:"RCTWebView"}),"\u3002"]}),"\n"]}),"\n",(0,i.jsx)("img",{class:"half-size",alt:"Create an Objective-C RCTWebView class",src:"/docs/assets/fabric-native-components/4.webp"}),"\n",(0,i.jsxs)(n.ol,{start:"5",children:["\n",(0,i.jsxs)(n.li,{children:["\u5c06 ",(0,i.jsx)("code",{children:"RCTWebView.m"})," \u91cd\u547d\u540d\u4e3a ",(0,i.jsx)("code",{children:"RCTWebView.mm"}),"\uff0c\u4f7f\u5176\u6210\u4e3a Objective-C++ \u6587\u4ef6\u3002"]}),"\n"]}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-text",metastring:'title="Demo/ios"',children:"Podfile\n...\nDemo\n\u251c\u2500\u2500 AppDelegate.h\n\u251c\u2500\u2500 AppDelegate.mm\n...\n// highlight-start\n\u251c\u2500\u2500 RCTWebView.h\n\u251c\u2500\u2500 RCTWebView.mm\n// highlight-end\n\u2514\u2500\u2500 main.m\n"})}),"\n",(0,i.jsx)(n.p,{children:"\u521b\u5efa\u5934\u6587\u4ef6\u548c\u5b9e\u73b0\u6587\u4ef6\u540e\uff0c\u53ef\u4ee5\u5f00\u59cb\u5b9e\u73b0\u5b83\u4eec\u3002"}),"\n",(0,i.jsxs)(n.p,{children:["\u4ee5\u4e0b\u662f ",(0,i.jsx)(n.code,{children:"RCTWebView.h"})," \u6587\u4ef6\u7684\u4ee3\u7801\uff0c\u58f0\u660e\u4e86\u7ec4\u4ef6\u63a5\u53e3\u3002"]}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-objc",metastring:'title="Demo/RCTWebView/RTNWebView.h"',children:"#import