React-Native Navigator已棄用且已從此軟件包中刪除

Question

我收到以下錯誤消息。

導航器已棄用且已從此軟件包中刪除。現在可以從安裝並導入反應本機不推薦使用的自定義組件而不是反應本機。瞭解替代導航解決方案在http://facebook.github.io/react-native/docs/navigation.html

然後我會更新反應母語棄用的定製組件包，但發行不解決

的package.json

"dependencies": { 
    "react": "16.0.0-alpha.6", 
    "react-native": "0.44.2", 
    "react-native-deprecated-custom-components": "^0.1.0", 
    "sendbird": "^3.0.30" 
}, 

main.js

var React = require('react-native') 
var { 
    Navigator, 
    StyleSheet 
} = React; 

var Login = require('./components/login'); 

import NavigationExperimental from 'react-native-deprecated-custom-components'; 

var ROUTES = { 
    login: Login 
}; 

module.exports = React.createClass({ 
    renderScene: function(route, navigator) { 
    var Component = ROUTES[route.name]; 
    return <Component route={route} navigator={navigator} />; 
    }, 
    render: function() { 
    return (

     <NavigationExperimental.Navigator 
     style={ styles.container } 
     initialRoute={ {name: 'login'} } 
     renderScene={this.renderScene} 
     configureScene={() => { return Navigator.SceneConfigs.FloatFromRight; } } 
     /> 
    ); 
    } 
}); 

var styles = StyleSheet.create({ 
    container: { 
    flex: 1 
    } 
}); 

任何一個讓我知道解決這個問題

Answer 1

伊夫使用下面的代碼來解決我的問題

main.js

var React = require('react-native') 
var { 
    Navigator, 
    StyleSheet 
} = React; 

var Login = require('./components/login'); 

import NavigationExperimental from 'react-native-deprecated-custom-components'; 

var ROUTES = { 
    login: Login 
}; 

module.exports = React.createClass({ 
    renderScene: function(route, navigator) { 
    var Component = ROUTES[route.name]; 
    return <Component route={route} navigator={navigator} />; 
    }, 
    render: function() { 
    return (

     <NavigationExperimental.Navigator 
     style={ styles.container } 
     initialRoute={ {name: 'login'} } 
     renderScene={this.renderScene} 
     configureScene={() => { return NavigationExperimental.Navigator.SceneConfigs.FloatFromRight; } } 
     /> 
    ); 
    } 
}); 

var styles = StyleSheet.create({ 
    container: { 
    flex: 1 
    } 
}); 

任何一個讓我知道解決此問題

我已更改行

configureScene={() => { return NavigationExperimental.Navigator.SceneConfigs.FloatFromRight; } } 

要

configureScene={() => { return NavigationExperimental.Navigator.SceneConfigs.FloatFromRight; } } 

解決我的問題

Answer 2

您應該使用堆棧導航現在

import { StackNavigator } from 'react-navigation'; 

const SimpleApp = StackNavigator({ 
    Home: { screen: HomeScreen }, 
    Chat: { screen: ChatScreen }, 
}); 

<Button 
      onPress={() => navigate('Chat')} 
      title="Chat with Lucy" 
     /> 

參考：https://reactnavigation.org/docs/intro/