使用 ant-design select 渲染可搜索的选择下拉列表
根据文档,我编写了以下组件
import React, { Component } from 'react';
import { Select } from 'antd';
const Option = Select.Option;
function handleChange(value) {
console.log(`selected ${value}`);
}
function handleBlur() {
console.log('blur');
}
function handleFocus() {
console.log('focus');
}
export default class SearchBarDemo extends Component {
render() {
return (
<Select
showSearch
style={{ width: 200 }}
placeholder="Select a person"
optionFilterProp="children"
onChange={handleChange}
onFocus={handleFocus}
onBlur={handleBlur}
filterOption={(input, option) => option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0}
>
<Option value="jack">Jack</Option>
<Option value="lucy">Lucy</Option>
<Option value="tom">Tom</Option>
</Select>
);
}
}
但是选择下拉列表的样式未正确
最佳答案
关于javascript - ant-design select 样式不正确,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49295917/