Ссылка на другой URL после получения

Question

Находится на странице отправки.Пользователь нажимает кнопку «Отправить».Если запрос выполнен успешно, он перейдет на страницу продукта.Если нет, то он остается на текущей странице отправки.

handleSubmit() {
    fetch(post request)
    .then(response => return response)
    .then(submit => 
        if (submit.ok === true) {
            <Link to={"/product" />
        } else {
            this.setState({error: Submit failed});
        })
     .catch()
}

render() {
    return (
        <button onClick={this.handleSubmit}>Submit</button>
    )
}

Он не перенаправляет на другую страницу или страницу продукта.Я что-то пропустил?

В настоящее время он не меняет URL, он просто добавил путь к текущему пути.

Answer 1

Это неправильное использование <Link>.

Чтобы программно перейти на другой маршрут, вы можете сделать:

this.props.history.push("/newRoute");

при условии, что вы передаете объект history, используя либо withRouter, либо имея текущий компонент внутри Switch заявление, например.

import React from "react";
import ReactDOM from "react-dom";
import { BrowserRouter, Route, Switch, withRouter } from "react-router-dom";

import "./styles.css";

class App extends React.Component {
  state = { b: false };

  handleClick = () => {
    this.props.history.push("/horse");
  };

  render() {
    return (
      <div className="App">
        <button onClick={this.handleClick}>click</button>
      </div>
    );
  }
}

const RoutedApp = withRouter(App);

const rootElement = document.getElementById("root");
ReactDOM.render(
  <BrowserRouter>
    <RoutedApp />
  </BrowserRouter>,
  rootElement
);

CodeSandbox здесь .