react Select的options属性的数据格式是?
时间: 2024-03-17 09:42:21 浏览: 87
react-select-country-list:这是react-select的国家_地区列表数据格式
React Select 的 `options` 属性可以接受多种不同格式的数据,常见的有以下格式:
1. 数组格式:
```javascript
const options = [
{ value: 'chocolate', label: 'Chocolate' },
{ value: 'strawberry', label: 'Strawberry' },
{ value: 'vanilla', label: 'Vanilla' }
];
```
2. 简单数组格式:
```javascript
const options = ['Chocolate', 'Strawberry', 'Vanilla'].map((flavor) => ({
value: flavor.toLowerCase(),
label: flavor
}));
```
3. 分组数组格式:
```javascript
const options = [
{
label: 'Colors',
options: [
{ value: 'red', label: 'Red' },
{ value: 'blue', label: 'Blue' },
{ value: 'green', label: 'Green' }
]
},
{
label: 'Flavors',
options: [
{ value: 'chocolate', label: 'Chocolate' },
{ value: 'strawberry', label: 'Strawberry' },
{ value: 'vanilla', label: 'Vanilla' }
]
}
];
```
4. 异步加载数据格式:
```javascript
const loadOptions = (inputValue, callback) => {
setTimeout(() => {
callback([
{ value: 'chocolate', label: 'Chocolate' },
{ value: 'strawberry', label: 'Strawberry' },
{ value: 'vanilla', label: 'Vanilla' }
]);
}, 1000);
};
```
以上这些格式都可以作为 React Select 的 `options` 属性的值传入。
阅读全文