在React Router v4中獲取未定義組件

Question

剛剛升級到react-router-dom 4.0.0。我所有的組件都是常規的class es或胖箭頭。他們全部使用export default ThatComponent出口。但我得到這個：

未捕獲的錯誤：元素類型無效：期望一個字符串（對於內置組件）或一個類/函數（對於複合組件）但得到：未定義。您可能忘記將組件從其定義的文件中導出。請檢查渲染方法Router。

// minimal showcase 
import { BrowserRouter, Match, Miss } from 'react-router'; 

const Router =() => (
    <BrowserRouter> 
    <div> 
     {/* both Match and Miss components below cause an error */} 
     <Match exactly pattern="/login" component={Login} /> 
     <Match exactly pattern="/frontpage" component={Frontpage} /> 
     <Match exactly pattern="/logout" render={() => (<div>logout</div>)} /> 
     <Miss component={NoMatch} /> 
    </div> 
    </BrowserRouter> 
); 

爲什麼在<Match>組件認爲其他組件是不確定的？

Answer 1

在react-router的最終版本中沒有Match也沒有Miss。你只需要使用Route。另外，您需要安裝並使用進口react-router-dom包使用BrowserRouter（請參閱React Router documentation）。

要以最小的變化你的榜樣的工作，你需要做到以下幾點：

請看看NoMatchExample in React Router docs，看看如何以及何時使用Switch。

Answer 2

入住反應路由器這裏來源：https://unpkg.com/react-router@4.0.0/index.js（也https://unpkg.com/react-router-dom@4.0.0/index.js）， 沒有比賽下它。 匹配也許屬於其他包。