在导航栏中单击按钮时如何重定向？

Question

我有一个相对通用的用户界面，导航栏中有一个搜索框和一个按钮，内容面板显示了搜索结果（productList.js）。如果单击该搜索按钮，我希望内容面板显示结果。我可以接受，如果当前URL是productList.js，但是在当前URL不是productList.js的情况下，我应该使其重定向到productList.js。因此，我将withRouter和history一起使用，但无法正常工作。您能给我一些建议吗？如果单击，它不会返回任何错误。我也不知道如何调试它。所以...

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);