next.js 不变式失败：浏览器历史需要DOM

ejk8hzay 于 2023-04-20 发布在其他

关注(0)|答案(2)|浏览(162)

我的App.js（简化了，但仍然会出错）

import React, { Component } from "react";

class App extends Component {
  state = {};

  componentDidMount() {
    this.setState({ user });
  }
}

export default App;

我已经更新了我的index.js：

import React from "react";
import { BrowserRouter } from "react-router-dom";
import App from "./App";

const Index = () => (
  <BrowserRouter>
    <App />
  </BrowserRouter>
);

export default Index;

它给出错误Invariant failed: Browser history needs a DOM

next.js

来源：https://stackoverflow.com/questions/59508837/invariant-failed-browser-history-needs-a-dom

2条答案

按热度按时间

wfsdck301#

在NextJS中，你不必像在普通的ReactJS应用程序中那样添加ReactDOM.render部分。NextJS在渲染应用程序时会自己做这件事。
最低限度，你必须运行的应用程序是在pages目录中添加一个index.js：

const Index = () => (
  <div>
    <p>Hello Next.js</p>
  </div>
);

export default Index;

请注意，这里的Index组件是默认导出的。
Learn NextJS Docs

赞(0）回复(0）举报 2023-04-20

fwzugrvs2#

如果你在nextjs中使用react-router-dom，你只需要添加

if (typeof window === 'undefined') return null;
return <Container {...props} />;

在你的pages/{dummy}/index.js文件中避免“Invariant failed：浏览器历史记录需要DOM”enter image description here

赞(0）回复(0）举报 2023-04-20

我来回答

next.js 不变式失败：浏览器历史需要DOM

2条答案

相关问题

热门标签

最新问答