ネイティブルーターに反応する - 要素タイプが無効です

Question

私はReact Nativeアプリで異なるページのルートを作成しようとしています。

// @flow 
 

 
import React, { Component } from 'react'; 
 
import View from 'react-native'; 
 
import { NativeRouter, Route, Link } from 'react-router-native' 
 
import PropTypes from 'prop-types'; 
 

 
import Splash from './components/Splash'; 
 
import Home from './components/Home'; 
 

 
class Router extends Component { 
 
    
 
    componentWillMount() { 
 
     navigator = this.context.history; 
 
    } 
 

 
    /** 
 
    * Render 
 
    * @return {XML} JSX 
 
    */ 
 
    render() { 
 
     return (
 
      <View style={{flex: 1}}> 
 
       <Route exact path="/" component={Splash}/> 
 
       <Route exact path="/home" component={Home}/> 
 
      </View> 
 
     ); 
 
    } 
 
} 
 

 
export default Router;

をそして私は私のスプラッシュコンポーネントのルータをインポートした：だから私は、新しいルータとrouter.jsファイルを作成しました。そこから、ユーザーをホーム画面にリダイレクトするボタンが必要です。

import React, { Component } from 'react'; 
 
import { View, Text, Image, Button } from 'react-native'; 
 
import LinearGradient from 'react-native-linear-gradient'; 
 
import { NativeRouter, Route, Link, Switch } from 'react-router-native' 
 
import Home from "./Home"; 
 
import Router from "../router"; 
 

 
class Splash extends Component { 
 

 
    render() { 
 
     return(
 
      <View style={ styles.container }> 
 
       <Router> 
 
        <Button onPress={() => navigator.push('/home')} 
 
          title="Go to home" /> 
 
       </Router> 
 
      </View> 
 
     ); 
 
    } 
 
} 
 

 
export default Splash;

しかし、私は次のエラーを取得する：

Invariant Violation: Element type is invalid expected a string (for built-in components) or a class/function (for composite components) but got: object 

Check the render method of 'Router' 

これは、ネイティブのルータを反応させ、私はそれが働いて得ることはありません使用して私の最初の時間です。誰かが画面間を移動するためのシンプルなルータを作るための最善の解決策を知っていますか？

Answer 1

あなたが渡しているドキュメント内のコンポーネントのようです：あなたがファイルをインポートしているように見える

const Detail = (props) => (
    <View style={[styles.component, { backgroundColor: '#FFFFFF' }]}> 
    {props.children}</View> 
); 

：コンポーネントはちょうどこのように行われてい

https://github.com/jmurzy/react-router-native

。それを参照して渡してください。上のドキュメントのようにして、それが解決するかどうか確認してください。