嘗試導入錯誤：“出口”未從“react-router-dom”導出

Question

請幫助我解決此錯誤

Attempted import error: 'Outlet' is not exported from 'react-router-dom'.

這就是我導入組件的方式

import { Outlet  } from "react-router-dom";

這是我的 Package.json 文件

"dependencies": {
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-icons": "^3.11.0",
"react-router-dom": "^5.2.0",
"react-router-hash-link": "^2.0.0",
"react-scripts": "3.4.3",
"serve": "11.3.2"
},

這是我嘗試使用它的地方

const User = () => {
  return (
    <div className="User">
      <TopNav />
      <SideNav />
      <div className="Body">
        <Outlet />
      </div>
    </div>
  );
};

Answer 1

看起來您正在嘗試使用將在 react-router-dom 的 V6 中發布的包中的功能，但您使用的版本是 v5.2。

如果您真的想使用Outlet功能，則必須使用該軟件包的 alpha、beta 或實驗版本，您可以在此處找到所有內容https://www.npmjs.com/package/react-router-dom

這些版本尚未准備好使用，並且可能包含錯誤和問題。 要安裝 V6 版本，只需執行npm install react-router-dom@version