React Navigation的‘createBottomTabNavigator()‘ has been moved to ‘react-navigation-tabs‘

最新推荐文章于 2025-04-21 12:39:45 发布

原创最新推荐文章于 2025-04-21 12:39:45 发布 · 975 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#react native #rnn

本文记录了在ReactNative项目中遇到的'createBottomTabNavigator()'移至'react-navigation-tabs'的问题，分析了可能的原因，并提供了详细的解决方案，包括更新代码和安装react-navigation-tabs包。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

前言

最近公司开发一个新项目，想去用react native，环境搭建网上有很多，也可以去官方网站跟着步骤一步一个脚印的走，哈哈哈哈哈哈哈！！！！
在这里插入图片描述
react native的路听说坑很多，然而我就遇到了我的第一个错误，现在做一下记录。

错误日志

'createBottomTabNavigator()' has been moved to 'react-navigation-tabs'

如下图所示：
在这里插入图片描述

问题分析

可能是react-navigation的版本的问题，但是在很久之前，有我头发已经退去的老前辈告诉我，react native 的版本要稳定下来，不能轻易的升级使用版本，不然会哭晕在厕所。

在这里插入图片描述

解决方法

因为是刚学习react-native，所以在网上找了很多大牛的博客，都说是更新的问题，那我就往这个方向找了。你还别说，还真是这个问题。
老版本的代码是这样：

import {createBottomTabNavigator} from "react-navigation";
import {createStackNavigator} from "react-navigation";
import {createDrawerNavigator} from "react-navigation";
import {createAppContainer} from "react-navigation";

新版本的代码是这样：

import {createBottomTabNavigator} from "react-navigation-tabs";
import {createStackNavigator} from "react-navigation";
import {createDrawerNavigator} from "react-navigation";
import {createAppContainer} from "react-navigation";

不知道你看出微妙之处了吗？
方法很简单，只需要执行

npm install --save react-navigation-tabs

这行命令就可以迎刃而解了，别忘了link一下。

更多文章资源，欢迎关注：程序猿阵线联盟

在这里插入图片描述