小编bik*_*wal的帖子

我希望我的应用程序从子目录（例如 localhost:3000/base ）提供服务，以便路由 page1 和 page2 在 localhost:3000/base/page1 和 localhost:3000/base/page2 提供服务

为此，我尝试在 React Router 中使用基本名称。

有用。

然而，只有 localhost:3000/page1 也匹配 page1 组件，并且 page2 也匹配。

我该如何防止这种情况发生？

import React from "react";
import {
  BrowserRouter as Router,
  Route,
  Switch,
} from "react-router-dom";


function App() {
  return (
    <>hi
    <Router basename="/base">
      <Switch>
        <Route path="/page1" render={props => <div>Hello</div>} />
        <Route path="/page2" render={props => <div>Hi</div>} />
      </Switch>
    </Router>
    </>
  );
}


export default App;

我不想点击提交来提交表单。所以我正在使用：

onSubmit (e) {
    e.preventDefault();
    console.log(this.state);
  }

<form className="loginform">
              <h1 className="logo"><img src={images.Logo} /></h1>
              <input
                className="login"
                placeholder="Username"
                type="text"
                required="true"
                onBlur={(e) => { this.userName(e); }}
              />
              <input className="login" placeholder="Password" type="password" required="true" />
              <input
                className="submit"
                onClick={(e) => { this.onSubmit(e); }}
                type="submit"
                value="Submit"
              />
            </form>

这样做表单验证不起作用。我想将默认表单验证与 PreventDefault 一起使用。