github
/
ant-design-vue
mirror of https://github.com/vueComponent/ant-design-vue
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix: multipe select can not separator content, #4844

pull/4846/head
tangjinzhou 2021-11-03 16:24:35 +08:00
parent 80f9b9e8ac
commit e38e59d05a
4 changed files with 11 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
components/_util/props-util/index.js
View File

@ -396,6 +396,13 @@ function isValidElement(element) {
function getPropsSlot(slots, props, prop = 'default') {
return props[prop] ?? slots[prop]?.();
}
export const getTextFromElement = ele => {
if (isValidElement(ele) && isStringElement(ele[0])) {
return ele[0].children;
}
return ele;
};
export {
splitAttrs,
hasProp,

2
components/select/index.en-US.md
View File

@ -45,7 +45,7 @@ Select component to select value from options.
| mode | Set mode of Select | 'multiple' \| 'tags' | - | |
| notFoundContent | Specify content to show when no result matches.. | string\|slot | 'Not Found' | |
| optionFilterProp | Which prop value of option will be used for filter if filterOption is true | string | value | |
| optionLabelProp | Which prop value of option will render as content of select. | string | `value` for `combobox`, `children` for other modes | |
| optionLabelProp | Which prop value of option will render as content of select. | string | `children` \| `label`(when use options) | |
| placeholder | Placeholder of select | string\|slot | - | |
| showSearch | Whether show search input in single mode. | boolean | false | |
| showArrow | Whether to show the drop-down arrow | boolean | true | |

2
components/select/index.zh-CN.md
View File

@ -46,7 +46,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/_0XzgOis7/Select.svg
| mode | 设置 Select 的模式为多选或标签 | 'multiple' \| 'tags' \| 'combobox' | - | |
| notFoundContent | 当下拉列表为空时显示的内容 | string\|slot | 'Not Found' | |
| optionFilterProp | 搜索时过滤对应的 option 属性，不支持 children | string | value | |
| optionLabelProp | 回填到选择框的 Option 的属性值，默认是 Option 的子元素。比如在子元素需要高亮效果时，此值可以设为 `value`。 | string | `children` （combobox 模式下为 `value`） | |
| optionLabelProp | 回填到选择框的 Option 的属性值，默认是 Option 的子元素。比如在子元素需要高亮效果时，此值可以设为 `value`。 | string | `children` \| `label`(设置 options 时) | |
| placeholder | 选择框默认文字 | string\|slot | - | |
| showSearch | 使单选模式可搜索 | boolean | false | |
| showArrow | 是否显示下拉小箭头 | boolean | true | |

3
components/vc-select/generate.tsx
View File

@ -53,6 +53,7 @@ import createRef from '../_util/createRef';
import PropTypes from '../_util/vue-types';
import warning from '../_util/warning';
import isMobile from '../vc-util/isMobile';
import { getTextFromElement } from '../_util/props-util';
const DEFAULT_OMIT_PROPS = [
'children',
@ -699,7 +700,7 @@ export default function generateSelector<
patchRawValues = patchLabels
.map(label => {
const item = mergedFlattenOptions.value.find(
({ data }) => data[mergedOptionLabelProp.value] === label,
({ data }) => getTextFromElement(data[mergedOptionLabelProp.value]) === label,
);
return item ? item.data.value : null;
})