Откройте URL-адрес на следующей странице, добавив текст поля ввода в Reactjs

Question

Мой метод:

launchSearch() {
 let searchString = this.searchRef.current?.value;
        window.open(
      "https://sample.com/list/market/" + searchString,
      "api-explorer"
    );
  }

Метод внутреннего рендеринга:

<TextInput
        placeholder="Placeholder text"
        onKeyPress={(event) => {
          if (event.key === "Enter") {
            this.launchSearch();
          }
        }}
        ref = {this.searchRef}
      />

Я могу передать ref из текстового ввода в мой метод launchSearch и возможность открыть URL-адрес в новой вкладке, объединив searchRef в URL-адресе. Есть ли другой способ сделать это без использования ref? Использование состояния и "значения" в textInput. Я пытаюсь использовать состояние, передавая value = {this.state.search} и в launchSearch:

launchSearch() {
        window.open(
      "https://sample.com/list/market/" + this.state.search,
      "api-explorer"
    );
  }

Он открывает новое окно, но не принимает значение поиска I вошел. Может ли кто-нибудь мне с этим помочь.

Answer 1

Вы можете использовать onKeyDown

  <TextInput
    placeholder="Placeholder text"
    onKeyDown={(event) => {
      if (event.key === "Enter") {
        this.launchSearch(event.target.value);
      }
    }}
  />

  launchSearch(search) {
      window.open("https://sample.com/list/market/"+search, "api-explorer");
  }