Реагировать JS: вызвать действие в форме и перенаправить на указанную страницу

Question

У меня есть компонент React с формой, действие которой выглядит следующим образом:

<center>
    <Form
        action={`/api/sets/`}
        method="post"
        onSubmit={this.onSubmit}>

        <Button color="primary" type="submit">
            Finish
        </Button>
    </Form>
</center >

Функция onSubmit выглядит следующим образом:

onSubmit = (e) => {
    e.preventDefault()
    window.location = "/workout-history";
    e.target.submit()
}

Действие на /api/sets/ происходит после нажатия кнопки, и функция onSubmit вызывается, но страница не перенаправляется.В сообщении на /api/sets я возвращаю статус 204, чтобы не определить, куда он идет.Я предполагаю, что возможно, что сначала вызывается функция, затем вызывается действие.Любые идеи о том, как вызвать действие формы и перенаправить страницу в другом месте?

Answer 1

Ответ, который вы ищете: , вероятно, это .

Предпочитают использовать withRouter HOC и вызывать history.push('/new-location') в функции onSubmit.

Answer 2

Для перенаправления вы можете использовать importact-router-dom.

import { Redirect } from 'react-router-dom'


onSubmit = () => {
      return <Redirect to='/target' />
  }

Вы можете посмотреть больше в: https://medium.com/@anneeb/redirecting-in-react-4de5e517354a