select 选择框里最多可是多选的情况
作者:互联网
antd +select
const validateMessages = {
required: '必填项',
};
// 3个选项的回调
const handleChange = (value) => {
let newArr;
if (value.length > 3) {
newArr = [].concat(value.slice(0, 2), value.sliace(-1));
searchForm.setFieldsValue({
admin: newArr,
});
}
};
// data: ["周易(001008)", "潘聪(006683)", "迟鑫(006038)", "张芸(002058)", "张艺博(013358)", "陈斯伦(010003)", "陆融(001185)",…]
<Form
className={styles.searchFormtest} layout="inline"
form={searchForm}
validateMessages={validateMessages}
>
a
<Form.Item name={'admin'} label=" 医生:">
<Select
mode="multiple" //可多选
className={styles.formInput} //选择框的长度
placeholder={'最多可选3个人'}
onChange={handleChange} //选中 option,或 input 的 value 变化时,调用此函数
rules={[{ required: true, message: '最多可选3个指标管理人' }]}
//校验最多只能选3个
>
{_.map(data, item =>
<Select.Option value={item} label={item}>
<span role="img" aria-label={item}>
{item}
</span>
</Select.Option>,
)}
</Select>
</Form.Item>
</Form>
标签:const,多选,newArr,value,data,item,框里,select 来源: https://blog.csdn.net/weixin_45481456/article/details/118991121