Переупорядочить множественный выбор в реакции выбора - PullRequest
Новая
       15

Переупорядочить множественный выбор в реакции выбора

0 голосов
/ 15 мая 2019

Я использую act-select с опорой isMulti, чтобы позволить пользователям выбирать из списка месяцев (январь-декабрь).Если пользователь выбирает месяцы не по порядку, я хочу, чтобы выбранные элементы были переупорядочены.

Как изменить порядок выбранных элементов?

Вот скриншот того, что я хочу записать:

enter image description here

Вот мой код: 

handleChange = (selectedOptions, action) => {
    selectedOptions.sort((a, b) => { // <=== THIS DOESN'T WORK
        return a.value - b.value;    // <=== THIS DOESN'T WORK
    });                              // <=== THIS DOESN'T WORK
    this.setState({selectedOptions});
    const {onSelectedOption} = this.props;
    onSelectedOption(selectedOptions);
};


render() {
    const {selectedOptions, options, error} = this.state;
    return (
        <div>
            <Select
                isMulti
                closeMenuOnSelect={false}
                value={selectedOptions}
                onChange={this.handleChange}
                options={options}
                isClearable={false}
                isSearchable={false}
                placeholder="Months..."
                classNamePrefix="react-select"
            />
            {error && <div className="alert alert-danger">{error}</div>}
        </div>
    );
}

1 Ответ

1 голос
/ 15 мая 2019

Вы действительно близки к решению, за исключением того, что вы неправильно сравниваете значения: 

selectedOptions.sort((a, b) => { 
  return a.value - b.value; --> this returns NaN
});

Значения a и b оба равны Strings, поэтому вам следует сделать: 

selectedOptions.sort((a, b) =>
  a.value.localeCompare(b.value)
);

, если вы хотите заказать их в алфавитном порядке.

...