React Native 遇到错误Text strings must be rendered within a <Text> component.

Posted 2023-05-17

参考技术A 其主要原因是因为语法错误，找了半天发现多了两个”``“，去掉就没事了。

我正在尝试使用 react-native 进行简单的路由，但我遇到了一些错误，例如 Failed building Javascript bundle

【中文标题】我正在尝试使用 react-native 进行简单的路由，但我遇到了一些错误，例如 Failed building Javascript bundle

【英文标题】：I am trying to do simple routing with react-native but I am getting some error like this Failed building Javascript bundle

【发布时间】：2020-01-31 01:36:00

【问题描述】：

我创建了一个 react native 项目并开始了路由。 在一个项目中，我有 Pages 文件夹，在这个文件夹中，我在 Home 文件夹中有一个 Home 文件夹，我有 Home。 j 的，并且我在 Pages 中有另一个文件夹，它是 About，因为我有 About.js。这些都是页面。

我有另一个文件夹是 Components，其中我有 Navbar 文件夹，我有 Navbar.js

我将此主页导入到 Navbar.js 我已经将导航栏导入到 App.js。 现在我收到这样的错误，无法从“Components/Navbar/Navbar.js”中解析“./Pages/Home/Home” 构建 JavaScript 包失败。

在 Pages 文件夹中，我有一个 Home 文件夹，其中有 Home.js

这个 Home.js

import React,  Component  from 'react';
import  StyleSheet, Text, View  from 'react-native';

export default class Home extends Component 
    render() 
        return (
            <View>
                <Text>We have friends</Text>
            </View>
        )
    


const styles = StyleSheet.create(
    container: 
      flex: 1,
      backgroundColor: '#fff',
      alignItems: 'center',
      justifyContent: 'center',
    ,
  );

在组件文件夹中，我有一个 Navbar 文件夹，其中有 Navbar.js

这是 Navbar.js

import  createStackNavigator  from 'react-navigation';
import Home from './Pages/Home/Home';

const Navbar = createStackNavigator(
    Home:  screen: Home ,
)

export default Navbar

这是 App.js

import React from 'react';
import  StyleSheet, Text, View  from 'react-native';
import Navbar from './Components/Navbar/Navbar'

export default function App() 
  return (
    <Navbar></Navbar>
  );


const styles = StyleSheet.create(
  container: 
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  ,
);

我想解决我所面临的错误。如果您仍然认为我不清楚我的疑问或如果您不理解我的问题，请发表评论。

【问题讨论】：

这似乎类似于：***.com/questions/58080348/…

嗨 Mike M，我浏览了你的链接，我试图解决我的错误，但我无法帮助我解决这个错误。

【参考方案1】：

请尝试类似 .../Pages/Home/Home

【讨论】：

嗨 Vamsi，我试过这个 .../Pages/Home/Home 但它不起作用

【参考方案2】：

我认为您应该安装react-navigation-stack 并从那里导入createStackNavigator，例如：

import  createStackNavigator  from 'react-navigation-stack';

即改变了导入方式。 检查docs

【讨论】：

嗨 Fotis Tsakiris，我按照你说的做了，但它显示了同样的错误。