ant-design/components/select/demo/label-in-value.md

36 lines
1.0 KiB
Markdown
Raw Normal View History

2016-05-19 13:44:08 +08:00
---
order: 10
2016-11-08 21:23:29 +08:00
title:
2016-07-10 08:55:43 +08:00
zh-CN: 获得选项的文本
en-US: Get value of selected item
2016-05-19 13:44:08 +08:00
---
2016-07-10 08:55:43 +08:00
## zh-CN
2016-05-19 18:05:35 +08:00
默认情况下 `onChange` 里只能拿到 value如果需要拿到选中的节点文本 label可以使用 `labelInValue` 属性。
选中项的 label 会被包装到 value 中传递给 `onChange` 等函数,此时 value 是一个对象。
2016-05-19 13:44:08 +08:00
2016-07-10 08:55:43 +08:00
## en-US
As a default behavior, the onChange callback can only get the value of the selected item. The labelInValue prop can be used to get the label property of the selected item.
The label of the selected item will be packed as an object for passing to the onChange callback.
2017-02-13 10:55:53 +08:00
````jsx
2016-05-19 13:44:08 +08:00
import { Select } from 'antd';
2018-06-27 15:55:04 +08:00
2016-05-19 13:44:08 +08:00
const Option = Select.Option;
function handleChange(value) {
2017-10-09 13:23:20 +08:00
console.log(value); // { key: "lucy", label: "Lucy (101)" }
2016-05-19 13:44:08 +08:00
}
ReactDOM.render(
2016-11-08 21:23:29 +08:00
<Select labelInValue defaultValue={{ key: 'lucy' }} style={{ width: 120 }} onChange={handleChange}>
<Option value="jack">Jack (100)</Option>
<Option value="lucy">Lucy (101)</Option>
2018-06-27 15:55:04 +08:00
</Select>,
mountNode);
2016-05-19 13:44:08 +08:00
````