Как перенаправить при нажатии кнопки в навигационной панели в реагировать? - PullRequest
Новая
       18

Как перенаправить при нажатии кнопки в навигационной панели в реагировать?

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

У меня относительно обычный пользовательский интерфейс, в навигационной панели есть поле поиска и кнопка, а на панели содержимого отображается результат поиска (productList.js).Если нажать эту кнопку поиска, я бы хотел, чтобы на панели содержимого отображался результат.Я согласен с этим, если текущий URL-адрес является productList.js, однако в случае, если текущий URL-адрес не является productList.js, я должен сделать это для перенаправления в productList.js.Поэтому я использовал вместе с рутером и историей, но он не работает должным образомНе могли бы вы дать мне несколько советов для этого?Если я нажимаю, он не возвращает ничего без каких-либо ошибок.Я тоже не знаю, как это отладить.так что ... 

import React, { Component } from "react";
import { Navbar } from "react-bootstrap";
import { FormGroup } from "react-bootstrap";
import { FormControl } from "react-bootstrap";
import { Button } from "react-bootstrap";
import { Link } from "react-router-dom";
import { withRouter } from "react-router";

class Header extends Component {
  go = () => {
    this.setKeyword(() => this.props.history.push("/productList"));
  };

  setKeyword = () => {
    this.props.setSearchKeyword("book");
  };

  render() {
    return (
      <div>
        <Navbar>
          <Navbar.Header>
            <Navbar.Brand>
              <a href="/">Shop</a>
            </Navbar.Brand>
            <Navbar.Toggle />
          </Navbar.Header>
          <Navbar.Collapse>
            <Link to="/signup">
              <Navbar.Text>Sign Up</Navbar.Text>
            </Link>
            <Link to="/login">
              <Navbar.Text>Log In</Navbar.Text>
            </Link>
            <Link to="/logout">
              <Navbar.Text>Log Out</Navbar.Text>
            </Link>
            <Navbar.Form pullLeft>
              <FormGroup>
                <FormControl ref="query" type="text" placeholder="Search" />
              </FormGroup>
              <Button
                type="submit"
                onClick={this.go}
              >
                Search
              </Button>
            </Navbar.Form>
          </Navbar.Collapse>
        </Navbar>
      </div>
    );
  }
}

export default withRouter(Header);
...