Reactjs “如何修复”；未捕获错误：不变量失败“；react中的react路由器dom错误

我有一个react网站，正在web主机上运行，我正在尝试向其添加

react router

，因此我使用

npm

安装了

react router dom

，但我没有进一步解释错误消息或任何内容就收到了此错误

我尝试将

react router dom

更改为

react router

，这是旧版本，但出现了不同的错误，因此我返回react router dom

// src/Container3d.js 
import React, { Component } from 'react'
import { BrowserRouter as Router, Route } from 'react-router-dom'

import Scene3d from './Scene3d'
import Model2 from './Model2'

class Container3d extends Component {

  render() {
    return (
      <Router>
        <div className="container3d">
          <Route path="/model-1" component={Scene3d} />
          <Route path="/model-2" component={Model2} />
        </div>
      </Router>
    )
  }
}

export default Container3d

///////////////////////////////////////////////////////

// src/App.js 
import { Link } from 'react-router-dom'

class App extends Component {

  render() {
    return (
      <ul>
        <li>
          <Link to="/model-1">model-1</Link>
        </li>
        <li>
          <Link to="/model-2">model-2</Link>
        </li>
      </ul>
    )
  }
}

export default App

---

你必须用

浏览器路由器

包装你的

应用程序

组件。 请看下面的代码

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

class App extends Component {

  render() {
    return (
     <Router>
      <ul>
        <li>
          <Link to="/model-1">model-1</Link>
        </li>
        <li>
          <Link to="/model-2">model-2</Link>
        </li>
      </ul>
     </Router>
    )
  }
}

export default App

从'react Router dom'导入{Link，browser Router as Router}
类应用程序扩展组件{
render（）{
返回(


模型-1


模型2


)
}
}
导出默认应用程序

在这里，我已经为您创建了一个小演示

---

希望这对你有用

非常感谢你，是的，成功了，你挽救了这一天：）

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

class App extends Component {

  render() {
    return (
     <Router>
      <ul>
        <li>
          <Link to="/model-1">model-1</Link>
        </li>
        <li>
          <Link to="/model-2">model-2</Link>
        </li>
      </ul>
     </Router>
    )
  }
}

export default App