由于react-navigation更新比较快 。本文写于2019-4-23
昨天弄了一整天的坑。网上资料过时造成的。
主要出现的BUD 输出:
npm install react-navigation --save 之后项目运行不了
import { StackNavigator} from "react-navigation"; 之后项目出错
Module AppRegistry is not a registered callable module 启动目录不对等等。
最后还是去官方看英文文档才发现已经改了方式。
react-navigation 官方英文
这个教训让我以后出问题最好是去官网看之后再百度&Google
cd 到项目目录之后 依次执行命令:
yarn add react-navigation
yarn add react-native-gesture-handler
链接所有本机依赖项:
react-native link react-native-gesture-handler
index.js不需要改动 在APP.js里面加入以下代码
import React from 'react';
import { View, Text, Button } from 'react-native';
import { createAppContainer, createStackNavigator, StackActions, NavigationActions } from 'react-navigation';
import HelloWorld from "./跳转类/HelloWorld";
class HomeScreen extends React.Component {
static navigationOptions = {
title: '首页'
}
render() {
return (
<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
<Text>Home Screen</Text>
<Button
title="Go to Details"
// onPress={() => this.props.navigation.push('WelCome')}
onPress={() => this.props.navigation.navigate('WelCome')}
/>
</View>
);
}
}
const AppNavigator = createStackNavigator({
Home: {
screen: HomeScreen,
},
WelCome: {
screen: HelloWorld,
},
});
export default createAppContainer(AppNavigator);
跳转函数和集成命令都有改动。
end
网友评论