选中时需要获取到除value之外的属性值extraData
<Select onChange={this.select}>
<Select.Option value={1} extraData={101}>选项1</Select.Option>
<Select.Option value={2} extraData={102}>选项2</Select.Option>
<Select.Option value={3} extraData={103}>选项3</Select.Option>
</Select>
select = (value, option) => {
let extraData = option.extraData
<Select onChange={this.select}> <Select.Option value={1} extraData={101}>选项1</Select.Option> <Select.Option value={2} extraData={102}>选项2</Select.Option> <Select.Option value={3} extraData={103}>选项3</Selec
我们都知道antd的select多选时，如果下拉框宽度不足，则自动浮动到下一行将下拉框撑大，但是这回影响到页面的整体布局。
我们期望的效果是，下拉框只显示一行的值，超出一行的部分自动隐藏。
下面有2种方案来实现这个效果。
1.利用浮动原理
设置下拉框的最大高度为一行的高度，然后超出的部分隐藏。
.ant-select-selection--multiple {
max-height: 32px;
overflow: hidden;
这种方式存在的弊端是如果有2个选项，一个很短一个很长，那么只能看到很短的值，长值被隐藏，会剩余很大的空白。
2.flex布局
使用 antd Select dropdownRender 方法自定义原组件下拉列表部分
虚拟滚动渲染，只渲染可视区列表，滚动动态加载其他列表，支持上万条数据渲染
对自定义列表项绑定原 Select 组件的各项方法和回调函数支持
同步使用 antd 组件下拉列表样式
同 antd select api
设置 mode={Select.SECRET_COMBOBOX_MODE_DO_NOT_USE} 属性可成为支持大数据渲染的 AutoComplete 组件
更多 antd 长列表渲染性能问题讨论可查看
antd 4.0 Select 组件已支持虚拟列表（ie11+），此组件基于 antd 3.x，可用于 ie9 浏览器
基本使用同 antd Select，只是使用 SuperSelect 代替 Select
触发select1，触发select2，再触发select1，此时select2里面的值变成了上次一选中的value 值，而不会被清空。
解决办法：
使用Select 里面的value属性，来进行清空
<Form style={{padding:'20px','boxSizing':'border-box'}}>
<Select defaultValue={packag
<div class="col-sm-4">
<select class="form-control" name=""id="wikj">
<option value="">- -请选择- -</option>
</select>
jQuery实现
//obj id名或class名 ; url 请求的接口
functi
Element-ui的select下拉框传递多个参数方法
<el-select v-model="value8" filterable placeholder="请选择" value-key="id" @change="currentSel">
<el-option v-for="item in options" :key="item.id" :label="item.label" :value="item"></el-option>
</el-select&
<Form.Item label=作用对象>
{getFieldDecorator('targetId', { initialValue: this.state.targetId }, {
rules: [{
required: false,
message: '作用对象'
<Select placeholder=请选择作用对象>
{targetList.map(entity => <Option key={enti
一、问题描述
最近在实现编辑表单的功能时，其中有一个下拉选择框，需要设定初始值，数据源为对象数组，其中包含id和name属性，将id设为Select.Option的key，将name设为下拉选择器展示的内容，结果发现选项匹配出现问题，即选择框中展示了设定的初始值，展开下拉列表，却未勾选。
以下为关键部分源代码：
<Card title="前端展示">
<FormItem {...formItemLayout} label="前端展示：">
{getFieldDecorat
*getSiteOptionsAdmin({ payload }, { call, put }) {
try {
const { data } = yield call(notice.getSiteOptionsAdmin, payload);
if (da...
你可以通过 `onChange` 事件获取 `Select` 组件中当前选中的选项的值。在 `onChange` 事件中，你可以将选中的选项的值传递给一个回调函数，进行处理。
以下是一个示例代码：
```jsx
import React, { useState } from 'react';
import { Select } from 'antd';
const { Option } = Select;
function handleChange(value) {
console.log(`selected ${value}`);
function SelectExample() {
return (
<Select defaultValue="lucy" style={{ width: 120 }} onChange={handleChange}>
<Option value="jack">Jack</Option>
<Option value="lucy">Lucy</Option>
<Option value="disabled" disabled>
Disabled
</Option>
<Option value="Yiminghe">yiminghe</Option>
</Select>
在上面的示例中，我们定义了一个 `handleChange` 函数来处理选中的选项的值。当用户选择一个选项时，`handleChange` 函数会被调用，并将所选选项的值作为参数传入。你可以在该函数中对选项的值进行任何处理。
如果你需要在 `Select` 中设置默认选中的选项，可以使用 `defaultValue` 属性来完成。例如，在上面的示例中，我们将 `defaultValue` 设置为 "lucy"，这将使 "Lucy" 成为默认选中的选项。
