React-router - навигация по history.push () обновляет страницу - PullRequest
Новая
       32

React-router - навигация по history.push () обновляет страницу

0 голосов
/ 28 декабря 2018

Когда я использую компонент <Link />, навигация происходит без обновления страницы, но когда я пытаюсь перейти по history.push() (т. Е. При отправке формы), страница обновляется.Как я могу предотвратить, чтобы history.push () выполняла обновление?Вот мой код: 

import React from 'react';
import {withRouter} from 'react-router-dom';
import qs from 'query-string';

class SearchBox extends React.Component {
  constructor(props) {
    super(props);
    this.state = {value: ''};

    this.handleChange = this.handleChange.bind(this);
    this.handleSubmit = this.handleSubmit.bind(this);
  }

  handleChange(e) {
    this.setState({value: e.target.value});
  }

  handleSubmit(e) {
    this.props.history.push('?' + qs.stringify({search: this.state.value}));
    e.preventDefault();
  }

  render() {
    return (
      <form onSubmit={this.handleSubmit}>
        <div className="searchbox">
          <input
            type="text"
            name="search"
            value={this.state.value}
            onChange={this.handleChange}
            placeholder="Search..."
          />
        </div>
      </form>
    );
  }
}

export default withRouter(SearchBox);
...