URLПарамы реактивного поиска со следующими маршрутами - PullRequest
Новая
       19

URLПарамы реактивного поиска со следующими маршрутами

0 голосов
/ 31 августа 2018

Кто-нибудь имеет представление о том, как обрабатывать URL-адреса URLParams какого-либо компонента реактивного поиска с next-routes?

Мой шаблон для, скажем, некоторого фильтра страны, должен выглядеть следующим образом: pattern: '/country/:countryname/ вместо ?country="{countryname}"

Вот как я это реализую: 

<SingleDropdownList
    componentId="country"
    dataField="locationInformation.country.name"
    URLParams
/>

1 Ответ

0 голосов
/ 01 сентября 2018

По умолчанию URLParams будет устанавливать значение компонентов на основе параметров запроса (путем поиска соответствующего componentId в URL). Однако при использовании пользовательского URL-адреса значение по умолчанию URLParams не будет работать, поскольку оно не может определить, какое значение передать компоненту.

В таких случаях вы можете использовать опору defaultSelected для инициализации значения компонента, считывая его из URL. В случае next-routes вы можете выбрать slug из query и передать требуемое значение компоненту SingleDropdownList: 

render() {
  const defaultValue = this.props.url.query.slug; // or parse it to find the required value
  return (
    ...
      <SingleDropdownList
        ...
        defaultSelected={defaultValue}. // value from url
      />
    ...
  );
}

Вы также можете обновить URL при выборе значения, используя onValueChange prop docs : 

<SingleDropdownList
  ...
  onValueChange={(value) => Router.push('country', { slug: value })}
/>
...