0

在默认 Piral 实例中调试我的 pilet 时出现此错误：

Uncaught Error: Invariant failed: You should not use <Link> outside a <Router>

奇怪的是下一个日志条目报告错误来自内部：Router

react_devtools_backend.js:2430 The above error occurred in the <Context.Consumer> component:
    in Link
    in Unknown
    in Suspense (created by ErrorBoundary)
    in ErrorBoundary
    in Unknown (created by Menu)
    in li (created by MenuItem)
    in MenuItem
    in Unknown (created by Menu)
    in ul (created by MenuContainer)
    in div (created by MenuContainer)
    in div (created by MenuContainer)
    in nav (created by MenuContainer)
    in header (created by MenuContainer)
    in MenuContainer
    in Unknown (created by Menu)
    in Menu (created by Layout)
    in div (created by Layout)
    in Layout
    in Unknown (created by PiralContent)
    in PiralContent (created by PiralView)
    in Router (created by BrowserRouter)
    in BrowserRouter
    in Unknown (created by PiralView)
    in PiralProvider (created by PiralView)
    in PiralView (created by Piral)
    in Piral

我的堆索引.jsx：

import { Link } from 'react-router-dom'

const App = () => 'My pilet'

export function setup(app) {
  app.registerPage('/my-pilet', App)
  app.registerMenu(() => <Link to="/my-pilet">My Pilet</Link>)
}

我的 Piral 实例使用由提供的样板，piral-cli并且完全没有变化。它甚至有一个可以正常工作且没有错误的默认菜单项：

在此处输入图像描述

（“未找到”是 Piral 提供的默认菜单项）

为什么我会收到此错误？

  • 皮拉尔 0.12.4
  • Piral CLI 0.12.4
  • Piral CLI Webpack 0.12.4
4

2 回答 2

1

你的设置一定有问题。如果出现此错误，则意味着您Link的路由上下文与来自应用程序外壳的路由上下文不同。我的怀疑是你不分享react-router-dom。把它放在peerDependencies你的 pilet 的 package.json 中。

于 2021-01-26T22:50:35.327 回答
-1

该错误是不言自明的，您只需将 <Link .. /> 与路由器标签括起来。尝试这个：

import { BrowserRouter as Router, Link } from 'react-router-dom'

const App = () => 'My pilet'

export function setup(app) {
  app.registerPage('/my-pilet', App)
  app.registerMenu(() => <Router> <Link to="/my-pilet">My Pilet</Link> <Router>)
}

来源：https ://reactrouter.com/web/example/url-params

于 2021-01-22T09:15:19.100 回答