React Native
文章平均质量分 62
CuiXg
生活很短,让它精彩一点
展开
-
React Navigation 初探 - Tab navigation
React Navigation 初探 - Tab navigation在手机应用中最参见的导航是 tab-based navigation, 在屏幕底部或者导航栏下面添加选择项卡.主要使用 createBottomTabNavigator.也可以使用 createMaterialBottomTabNavigator和 createMaterialTopTabNavigator添加选项卡.使用前需要先安装 @react-navigation/bottom-tabs:npm: npm install原创 2021-08-17 09:50:09 · 482 阅读 · 0 评论 -
React Navigation 初探 - 自定义导航按钮
React Navigation 初探 - 标题按钮在导航栏添加一个按钮在标题左边或右边放置按钮时最常见. 让我们在标题右边添加一个按钮(一个屏幕总难以触碰的位置)function StackScreen() { return ( <Stack.Navigator> <Stack.Screen name="Home" component={HomeScreen} options={{ head原创 2021-08-16 15:48:43 · 748 阅读 · 0 评论 -
React Navigation 初探 - 配置标题栏
React Navigation 初探 - 配置标题栏设置标题Screen 组件接收一个 options 属性, 它是一个对象或一个返回对象的函数. 它包含了各种配置项, 比如我们用于设置标题的 title.function StackScreen() { return ( <Stack.Navigator> <Stack.Screen name="Home" component={HomeScreen} opt原创 2021-08-16 15:12:17 · 665 阅读 · 0 评论 -
React Navigation 初探 - 页面传值
React Navigation 初探 - 页面传值我们已知如何创建堆栈导航器和页面之间的跳转,接下来我们将学习页面间如何进行传值.页面传值只要分为两部分:通过将参数作为 navigation.navigate 函数的第二个参数放入对象中,将参数传递给路由:navigation.navigate('RouteName', { /* params go here */ })跳转页面中读取数据:route.params.我们建议您传递的参数是 JSON 可序列化的.在 Snack 中尝试f原创 2021-08-11 16:29:13 · 1121 阅读 · 0 评论 -
React Navigation 初探 - 页面跳转
React Navigation 初探 - 页面跳转在网页中页面跳转:<a href="details.html">Go to Details</a>或者另一张写法<a onClick={() => { window.location.href = 'details.html'; }}>Go to Details</a>在 navigation 中我们会做一些类似后者操作,通过 navigation 一些属性实现页面跳原创 2021-08-11 15:08:41 · 762 阅读 · 0 评论 -
React Navigation 初探 - 创建 native stack navigator
React Navigation 初探 - 创建 native stack navigator安装 @react-navigation/native-stack上一章节我们安装的是导航器的构建模块和基础模块, React Navigation 中的每个 navigator 都有自己库, 使用native stack navigator我们需要安装@react-navigation/native-stack :npm: npm install @react-navigation/native-stack原创 2021-08-11 14:41:45 · 726 阅读 · 0 评论 -
React Navigation 初探 - 安装
React Navigation 初探 - 安装版本要求React Navigation 6 需要 react-native@0.63.0 以及以上版本;如果使用了 Expo, SDK 版本应为 41 以及以上.安装安装 react-navigation需要在项目安装必须的包npm 安装: npm install @react-navigation/nativeYarn 安装: yarn add @react-navigation/native安装 react-native-sc原创 2021-08-11 14:06:45 · 385 阅读 · 0 评论