Question

每当我尝试在Navbar中使用React-route-dom Link时，我都会遇到问题，这会给我这个错误：

Uncaught Error: Syntax error, unrecognized expression: #/login
    at Function.ga.error (jquery.min.js:2)
    at ga.tokenize (jquery.min.js:2)
    at ga.select (jquery.min.js:2)
    at Function.ga [as find] (jquery.min.js:2)
    at r.fn.init.find (jquery.min.js:2)
    at new r.fn.init (jquery.min.js:2)
    at r (jquery.min.js:2)
    at r (scrollspy.min.js:1)
    at HTMLDivElement.<anonymous> (scrollspy.min.js:1)
    at Function.each (jquery.min.js:2)

当我在本地主机上吃午饭时，该错误在控制台中弹出，但是当我通过URL访问链接页面并返回首页而不进行刷新时，错误消失了。

我尝试使用数据切换，但没有用。

<ul className="nav navbar-nav navbar-right" id="mySidenav2">
  <li>
    <button
      type="button"
      className="btn btn-custom navbar-btn btn-rounded waves-effect waves-light"
    >
      <Link to="/signup" data-target="#mySidenav2">
        SIGNUP
      </Link>
    </button>
  </li>
  <li>
    <button
      type="button"
      className="btn btn-custom navbar-btn btn-rounded waves-effect waves-light"
    >
      <Link to="/login" data-target="#mySidenav2">
        LOGIN
      </Link>
    </button>
  </li>
</ul>

我的路由代码：

render() {
  return (
    <div className="App">
      <HashRouter>
        <Switch>
          <Route exact path="/" component={HomePage} />
          <Route path="/stats/:hashCode" component={Stats} />
          <Route exact path="/login" component={Login} />
          <Route path="/thanks" component={Thanks} />
          {/* <Route path="/:hashCode" component={Signup} /> */}
          <Route path="/signup/:hashCode" component={Signup} />
          <Route path="/signup" component={Signup} />
          <Route path="/verify/:hashCode" component={Verify} />
        </Switch>
      </HashRouter>
    </div>
  );
}

Answer 1

我认为您不应该将“链接内”按钮包装起来。单击它时，您需要路由至组件，因此为什么要将其包装在按钮中。如果您希望链接看起来像一个按钮，请使用css对其进行样式设置，但不要将其包装在按钮或<li>

中

ReactJS jquery.min.js：2未捕获的错误：语法错误，无法识别的表达式：＃/ login

1 个答案: