阵营4.0.0 BrowserRouter渲染的所有路由

我试图让与反应用户注册和流星简单的短信应用程序，当我尝试添加路由像这样：阵营4.0.0 BrowserRouter渲染的所有路由

**//main.js** 
import React from "react"; 
import ReactDOM from "react-dom"; 
import {Meteor} from "meteor/meteor"; 
import {Tracker} from "meteor/tracker"; 
import { BrowserRouter, Route, browserHistory } from 'react-router-dom' 

import {Texts} from "./../imports/api/Text"; 
import App from "./../imports/ui/App"; 
import Name from "./../imports/ui/Name"; 
import NotFound from "./../imports/ui/NotFound" 

Meteor.startup(() => { 
    Tracker.autorun(() => { 
     let texts = Texts.find().fetch(); 
     console.log(texts); 
     console.log(browserHistory); 
     const routes = (
      <BrowserRouter> 
       <div> 
        <Route path="/chat" render={()=>{ 
         return <App texts={texts} /> 
        }}/> 
        <Route path="*" component={NotFound}/> 
       </div> 
      </BrowserRouter> 
     ); 
     ReactDOM.render(routes, document.getElementById("app")); 
    }); 
}); 


**//NotFound.js** 
import React from "react"; 

export default class NotFound extends React.Component{ 
    render(){ 
     return <p>URL not found</p> 
    } 
}

它呈现两件事给屏幕上，我看到我的错误404文本和我的短信应用程序。我的问题是，当我走到正确的路径（“/ chat”）时，如何获取NotFound页面以便在未识别Route时呈现（例如“/ asddkib”）并使其消失（仅适用于该应用程序）？现在，如果我去/聊天，然后都呈现到屏幕上。

来源

2017-08-13 Stuart Fong

使用switch语句

import { BrowserRouter, Route, Switch, browserHistory } from 'react-router-dom', 
<BrowserRouter> 
      <Switch> 
       <App path="/chat" texts={texts}/> 
       <Route component={NotFound}/> 
      </Switch> 
    </BrowserRouter>

来源

2017-08-13 21:11:30

仍然没有结果，我删除

为开关？或者我要添加开关的div？ –

它没有区别，但尝试更新回答 –

谢谢！所以，如果我是做新的页面，我将不得不作出一个或组件名称，如您 –

您正在寻找反应路由器交换机功能。

变化从进口“反应路由器”这样的：

import { BrowserRouter, Route, Switch, browserHistory } from 'react-router-dom',

然后，添加开关组件拖到渲染：

<BrowserRouter> 
     <Switch> 
      <Route path="/chat" render={()=>{ 
       return <App texts={texts} /> 
      }}/> 
      <Route component={NotFound}/> 
     </Switch> 
</BrowserRouter>

来源

2017-08-13 21:14:30

我有这个，但仍然无法工作.....我的NotFound.js有什么问题吗？（更新上面） –

我意识到我有小写“开关”组件，需要使用大写的Switch？我已经更新了代码。 –

你可以在你的NotFound组件中显示代码吗？（将它添加到答案中，并在此回复） –

阵营4.0.0 BrowserRouter渲染的所有路由

回答

相关问题