时间戳

首页 > 解决方案 > 如何在 React Router 中使用 Match 对象修复导入错误

reactjs - 如何在 React Router 中使用 Match 对象修复导入错误

问题描述

我是 React 和 Redux 的初学者...我需要在我的应用程序中使用 Match 对象...但是我收到以下错误...

尝试导入错误：“匹配”未从“反应路由器”导出。

尝试使用“react-router-dom”时也会出现相同的错误。

import React from 'react';
import logo from './logo.svg';
import './App.css';
import {Link} from 'react-router-dom'
import {Match} from 'react-router';
import GamesPage from './GamesPage'
//import './reducers/games'


function App() {
  return (
    <div className="App">
      <div className="App-header">
        <img src={logo} className="App-logo" alt="logo" />

        </div>
      <p>
          <Link to="games">Games</Link>
        </p>

        <Match pattern="/games" component={GamesPage} />

    </div>
  );
}

export default App;

标签： reactjsredux

解决方案

Match是 React Router v4 的 alpha 版本中的组件。

在 beta 版中，Match已重命名为Route（并且它的 props 已更改，因此模式现在是路径并且完全准确）。相反，您应该使用Switch语句，它只会呈现匹配的第一个Route（或Redirect）。您可以添加一个无路径组件作为Switch路由的最后一个子组件，并且它将在前面的路由不匹配时呈现。

您可以查看 API 文档以获取更多详细信息。

推荐阅读