Как обрабатывать несколько параметров с помощью isMulti в react-select - PullRequest
Новая
       101

Как обрабатывать несколько параметров с помощью isMulti в react-select

0 голосов
/ 13 июля 2020

Я пытаюсь сделать выбор, где я могу выбрать разные города и отфильтровать те, которые не из выбранных городов, мой фильтр, похоже, работает, но я не могу выбрать более одного города, даже если я установил isMulti на Select Я также пробовал isMulti={true}, но это не работает, я думаю, что это мой обработчик не работает: 

handleChange (selectedOptions) {
    selectedOptions.map(o => this.setState({by: o.value.value}))
      //var options = selectedOptions.value;
        /*var value = [];
        for (var i = 0, l = options.length; i < l; i++) {
          if (options[i].selected) {
            value.push(options[i].value);
          }
        }*/
        console.log(selectedOptions)
        
      }

закомментированный также не работает, но он работал с html выбор тега.

это мой фильтр: 

const filteredUsers = (usersGet.filter(item => {
        const checkHairColor = () => {
            if(Array.isArray(haircolor)) {
                return haircolor.length > 0 ? haircolor.includes(item.haircolor) : true;
            } else {
                return (haircolor === '') || (haircolor === item.haircolor);
            }
        }
        const checkCity = () => {
            if(Array.isArray(city)) {
                return city.length > 0 ? by.includes(item.city) : true;
            } else {
                return (city === '') || (city === item.city);
            }
        }
        const filter = (item.navn.toLowerCase().includes(searchfield.toLowerCase()) ||
            item.navn.toLowerCase().includes(searchfield.toLowerCase()) === '')
            && (item.age > minage || minage === '') 
            && (item.age < maxage || maxage === '')
            && checkHairColor()
            && checkCity();
        console.log(filter);
        return filter
        
        }))

Но мой фильтр, я уверен, работает, но не уверен, так как у меня нет массива для отправки фильтра пока нет. 

<Select 
    isMulti={true}
    hideSelectedOptions={false}
    closeMenuOnSelect={false}
    isSearchable={true}
    name="by"
    value={selectedOptions} 
    onChange={this.handleChange}
    options={byer}
   />

https://stackblitz.com/edit/react-fntxzp?file=index.js

1 Ответ

0 голосов
/ 14 июля 2020

Проблема с select заключалась в том, что вы неправильно обновили состояние. Если вы обновляете состояние в react, вы должны предоставить новый объект. И обновите только ту часть, которую нужно изменить.

https://stackblitz.com/edit/react-uygysb?file=index.js

...