通過在 Reactjs 中添加輸入字段的文本，打開下一頁中的 url

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}
      />

我能夠將來自 textinput 的ref傳遞給我的 launchSearch 方法，並且能夠通過在 URL 中連接 searchRef 在新選項卡中打開 URL。 有沒有其他方法可以做到這一點，而不使用參考？ 在 textInput 中使用 State 和“值”。 我正在嘗試通過傳遞值 = {this.state.search}並在啟動搜索中使用 state：

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

它正在打開新的 window，但不接受我輸入的搜索值。 誰能幫我這個。

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