#reactjs #react-select
Вопрос:
Обработайте реквизит из другого компонента, чтобы он соответствовал параметрам react-select
const labelOptionsProcessed = []
labelOptions.map(item => {
let tmpObj = {
id: item.id,
label: item.name,
name: item.name
}
labelOptionsProcessed.push(tmpObj)
})
tmpObj-это структура опций
<Select
options={labelOptionsProcessed}
isMulti
></Select>
Когда выбирается раскрывающееся значение , параметры изменяются на недоступные данные
Перед выбором опции :
После выбора опции:
Стекблитц: https://stackblitz.com/edit/react-4ddnq7
Комментарии:
1. не могли бы вы, пожалуйста, создать stackblitz.com/edit/react
2. Конечно, @Калхан. Торесс
Ответ №1:
Вы должны установить value свойство для параметров вместо id
экс:
const labelOptionsProcessed = []
labelOptions.map(item => {
let tmpObj = {
value: item.id, // here
label: item.name,
name: item.name
}
labelOptionsProcessed.push(tmpObj)
});
Я думаю, что это неправильный способ создания списка опций, я бы сделал что-то вроде этого
const labelOptionsProcessed = labelOptions.map(({ value, name: label, name }) => {
return {
value,
label,
name
};
});
Комментарии:
1. Это говорит о качестве кода, а не о том, почему список исчезает при выборе,Но все равно спасибо , я действительно использовал ответ, который вы упомянули, но переработал его, чтобы люди, которые читают вопрос, могли четко понять, что происходит, Следовательно, описательный код, который повышает читабельность
2. вы не прочитали весь пост целиком, просто прочитайте первый раздел, и вы поймете, почему он пустеет 🙂 спасибо
3. короче говоря, удалите
idсвойство из параметров и добавьтеvalueсвойство вместоid4. Если вы все еще боретесь, вот демонстрация исправления, о котором я упоминал stackblitz.com/edit/react-tvm5ct
5. О, мои плохие извинения, Это помогло, сработало отлично