Реагировать - добавить строку запроса с помощью ввода текста при изменении

Question

У меня простой текстовый ввод, и мне нужно передать строку запроса в URL из этого входного значения, но я не уверен, как это сделать.

Вот пример кода https://codesandbox.io/s/ecstatic-shadow-4nxlu

Answer 1

Я думаю, что вы можете передать входное значение в URL примерно так. Надеюсь, это поможет

https://codesandbox.io/s/eager-haze-o8hj9

import "./styles.css";

export default function App() {
  const handleChange = e => {
    const inputValueToUrl = encodeURI(e.target.value); 
    window.location.href = inputValueToUrl
    console.log(e.target.value);
  };

  // This is how I am currently using in my app 
  // Note: I am passing ids as props from the parent component.

  // const AUUrl = `/about/user?ids=${ids}`;
  // const endCodeAUUrl = encodeURI(AUUrl);
  // const viewUserClick = () => {
  //   if (ids.length) {
  //    window.location.href = endCodedAUUrl;
  //   }
  // };


  return (
    <div className="App">
      <label>Simple Text Inpunt</label>
      <br />
      <br />
      <input type="text" onChange={handleChange} />
    </div>
  );
}