React Navigation 不适用于 React Native Web

Question

我正在尝试在网络中实现反应导航。我正在使用 react-native-web 构建网络应用程序。

这是我的代码：

import React from 'react'
import {
  View, 
  StyleSheet,
  Dimensions
} from 'react-native'
import { createSwitchNavigator } from "@react-navigation/core"
import { createBrowserApp, Link } from "@react-navigation/web"

import { ApplicationProvider, Text, Button, Icon, Layout, Spinner } from '@ui-kitten/components'
import * as eva from '@eva-design/eva'


class App extends React.Component{

  static navigationOptions = {
            title: "Home"
        }
  static path = ""

  render(){
    return(
      <ApplicationProvider {...eva} theme={eva.light}>
        <Layout style={styles.container}>
        <Text style={{textAlign: 'center'}}>Home Screen</Text>
        <Link routeName="Chat">Go to Chat</Link>
      </Layout>
      </ApplicationProvider>
    )
  }
}
class Chat extends React.Component{
  static navigationOptions = {
    title: "Chat"
}
  static path = "chat"

  render(){
    return(
      <ApplicationProvider {...eva} theme={eva.light}>
          <Layout style={styles.container}>
          <Text style={{textAlign: 'center'}}>Chat Screen</Text>
          </Layout>
      </ApplicationProvider>
    )
  }
}
const styles = StyleSheet.create({
  container: {
    flexDirection: 'row',
    flexWrap: 'wrap',
    height: Dimensions.get('window').height
  }
});

const MyNavigator = createSwitchNavigator({
  Home: App,
  Chat: Chat
})

const BWeb = createBrowserApp(MyNavigator)
export default BWeb

当我尝试运行它时，它在浏览器中显示此错误： TypeError: (0 , _core.withNavigation) is not a function

Here is a screenshot

构建成功。但是错误出现在浏览器中。我安装了最新的库。

    "react-native": "^0.63.3",
    "react-native-web": "^0.13.16",
    "@react-navigation/core": "^5.12.4",
    "@react-navigation/web": "^1.0.0-alpha.9"

我正在使用 yarn 安装库。

我是使用 React 构建 Web 应用程序的新手。请帮助我度过难关

Answer 1

您不应使用 @react-navigation/core 和 @react-navigation/web 进行网络集成。

您可以按照 Web 集成的 Web 支持文档进行操作：https://reactnavigation.org/docs/web-support

React Navigation 不适用于 React Native Web

React Navigation does not work with React Native Web

reactjs

react-native

react-navigation

react-native-web