在我的 React-Native 项目中,我安装了以下版本的 react-navigation:
npm install react-navigation@^1.0.0-beta.11
然后运行命令:
npm 安装
在所有这些安装之后,我创建了一个名为 WelcomeScreen.js 的类,下面是为此给出的代码-
WelcomeScreen.js
import React, { Component } from "react";
import {
View,
StyleSheet,
Button
} from "react-native";
class WelcomeScreen extends Component {
static navigationOptions = {
header: 'none'
}
render() {
return (
<View style={styles.container}>
<Button title="Log in" onPress={() => this.props.navigation.navigate('LoginScreen')}/>
<Button title="Sign Up" onPress={() => this.props.navigation.navigate('SignUpScreen')}/>
</View>
)
}
}
export default WelcomeScreen;
const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: 'center',
justifyContent: 'center'
}
});
之后,我在我的 App.js 文件中路由了这个类。这是下面给出的代码:
App.js
import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { StackNavigator } from 'react-navigation'
import WelcomeScreen from './screens/WelcomeScreen'
export default class App extends React.Component {
render() {
return (
<AppStackNavigator/>
);
}
}
const AppStackNavigator = new StackNavigator({
WelcomeScreen: { screen: WelcomeScreen }
})
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',
},
});
然后在运行我的项目后,我不断收到此错误:
不变性违规:文本字符串必须在组件内呈现
Invarient violation:Text strings must be rendered within a component
我不明白为什么会出现此错误? 我尝试了以下解决方案-
Invariant Violation: Text strings must be rendered within a <Text> component
https://github.com/facebook/react-native/issues/20084
它们都对我没有帮助。所以,如果有人能帮我解决这个问题,那就太好了。
最佳答案
你在标题中使用了错误的值
static navigationOptions = {
header: "none"
};
将"none"
替换为null
static navigationOptions = {
header: null
};
关于javascript - 如何解决 Invariant violation :Text strings must be rendered within a <Text> component in React Native?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54993769/