Как построить URL на основе запроса в реакции

Question

У меня есть приложение, которое принимает строку поиска и возвращает результаты по одному маршруту: hosts.abc.com:3000. URL не меняется.

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

eg: hosts.abc.com:3000/?type=all&query=coins

Возможно ли это сделать с помощью реакции-роутера?

Answer 1

Для построения такого запроса вы можете использовать собственный браузер URLSearchParams :

const searchParams = new URLSearchParams();
searchParams.append("type", "all");
searchParams.append("query", "coins");
searchParams.toString(); // "type=all&query=coins"

// update browser url
this.props.history.push('/current/route/?' + searchParams.toString());
// or
this.props.history.push({
  pathname: '/current/route/',
  search: searchParams.toString()
})

Но если вам нужна лучшая поддержка, строка запроса - аналогичная опция.