fix: dropdownMatchSelectWidth:false not close virtual scroll #5242

This commit is contained in:
tangjinzhou 2022-02-14 10:14:16 +08:00
parent 2b0adaf717
commit 91c6a28205
8 changed files with 15 additions and 2 deletions

View File

@ -47,10 +47,15 @@ export default (
const getPopupContainer = computed(
() => props.getPopupContainer || configProvider.getPopupContainer,
);
const virtual = computed(() => props.virtual ?? configProvider.virtual);
const dropdownMatchSelectWidth = computed<boolean | number>(
() => props.dropdownMatchSelectWidth ?? configProvider.dropdownMatchSelectWidth,
);
const virtual = computed(
() =>
(props.virtual === undefined ? configProvider.virtual !== false : props.virtual !== false) &&
dropdownMatchSelectWidth.value !== false,
);
const size = computed(() => props.size || configProvider.componentSize);
const autocomplete = computed(() => props.autocomplete || configProvider.input?.autocomplete);
const csp = computed(() => configProvider.csp);

View File

@ -55,6 +55,7 @@ Some components use dynamic style to support wave effect. You can config `csp` p
| prefixCls | set prefix class | string | ant | |
| pageHeader | Unify the ghost of pageHeader ,Ref [pageHeader](<(/components/page-header)> | { ghost:boolean } | 'true' | 1.5.0 |
| transformCellText | Table data can be changed again before rendering. The default configuration of general user empty data. | Function({ text, column, record, index }) => any | - | 1.5.4 |
| virtual | Disable virtual scroll when set to false | boolean | true | 3.0 |
### ConfigProvider.config() `3.0.0+`

View File

@ -56,6 +56,7 @@ ConfigProvider 使用 Vue 的 [provide / inject](https://vuejs.org/v2/api/#provi
| pageHeader | 统一设置 pageHeader 的 ghost参考 [pageHeader](<(/components/page-header)>) | { ghost: boolean } | 'true' | 1.5.0 |
| prefixCls | 设置统一样式前缀。注意:需要配合 `less` 变量 `@ant-prefix` 使用 | string | `ant` | |
| transformCellText | Table 数据渲染前可以再次改变,一般用户空数据的默认配置 | Function({ text, column, record, index }) => any | - | 1.5.4 |
| virtual | 设置 `false` 时关闭虚拟滚动 | boolean | - | 3.0 |
### ConfigProvider.config() `3.0.0+`

View File

@ -26,6 +26,7 @@ Tree selection control.
| filterTreeNode | Whether to filter treeNodes by input value. The value of `treeNodeFilterProp` is used for filtering by default. | boolean\|Function(inputValue: string, treeNode: TreeNode) (should return boolean) | Function | |
| getPopupContainer | To set the container of the dropdown menu. The default is to create a `div` element in `body`, you can reset it to the scrolling area and make a relative reposition. | Function(triggerNode) | () => document.body | |
| labelInValue | whether to embed label in value, turn the format of value from `string` to `{value: string, label: VNode, halfChecked: string[]}` | boolean | false | |
| listHeight | Config popup height | number | 256 | |
| loadData | Load data asynchronously. | function(node) | - | |
| maxTagCount | Max tag count to show | number | - | |
| maxTagPlaceholder | Placeholder for not showing tags | slot/function(omittedValues) | - | |
@ -51,6 +52,7 @@ Tree selection control.
| treeNodeFilterProp | Will be used for filtering if `filterTreeNode` returns true | string | 'value' | |
| treeNodeLabelProp | Will render as content of select | string | 'title' | |
| value(v-model) | To set the current selected treeNode(s). | string\|string\[] | - | |
| virtual | Disable virtual scroll when set to false | boolean | true | 3.0 |
| title | custom title | slot | | 3.0.0 |
### Events

View File

@ -229,9 +229,9 @@ const TreeSelect = defineComponent({
return (
<VcTreeSelect
{...attrs}
{...selectProps}
virtual={virtual.value}
dropdownMatchSelectWidth={dropdownMatchSelectWidth.value}
{...selectProps}
id={id}
fieldNames={fieldNames}
ref={treeSelectRef}

View File

@ -27,6 +27,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/Ax4DA0njr/TreeSelect.svg
| filterTreeNode | 是否根据输入项进行筛选,默认用 treeNodeFilterProp 的值作为要筛选的 TreeNode 的属性值 | boolean\|Function(inputValue: string, treeNode: TreeNode) (函数需要返回 bool 值) | Function | |
| getPopupContainer | 菜单渲染父节点。默认渲染到 body 上,如果你遇到菜单滚动定位问题,试试修改为滚动的区域,并相对其定位。 | Function(triggerNode) | () => document.body | |
| labelInValue | 是否把每个选项的 label 包装到 value 中,会把 value 类型从 `string` 变为 `{value: string, label: VNode, halfChecked(treeCheckStrictly 时有效): string[] }` 的格式 | boolean | false | |
| listHeight | 设置弹窗滚动高度 | number | 256 | |
| loadData | 异步加载数据 | function(node) | - | |
| maxTagCount | 最多显示多少个 tag | number | - | |
| maxTagPlaceholder | 隐藏 tag 时显示的内容 | slot/function(omittedValues) | - | |
@ -52,6 +53,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/Ax4DA0njr/TreeSelect.svg
| treeNodeFilterProp | 输入项过滤对应的 treeNode 属性 | string | 'value' | |
| treeNodeLabelProp | 作为显示的 prop 设置 | string | 'title' | |
| value(v-model) | 指定当前选中的条目 | string/string\[] | - | |
| virtual | 设置 false 时关闭虚拟滚动 | boolean | true | 3.0 |
| title | 自定义标题 | slot | | 3.0.0 |
### 事件

View File

@ -38,6 +38,7 @@ Almost anything can be represented in a tree structure. Examples include directo
| switcherIcon | customize collapse/expand icon of tree node | slot | - | |
| showLine | Shows a connecting line | boolean \| {showLeafIcon: boolean}(3.0+) | false | |
| title | custom title | slot | | 2.0.0 |
| virtual | Disable virtual scroll when set to false | boolean | true | 3.0 |
### Events

View File

@ -39,6 +39,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/Xh-oWqg9k/Tree.svg
| switcherIcon | 自定义树节点的展开/折叠图标 | slot | - | |
| showLine | 是否展示连接线 | boolean \| {showLeafIcon: boolean}(3.0+) | false | |
| title | 自定义标题 | slot | | 2.0.0 |
| virtual | 设置 false 时关闭虚拟滚动 | boolean | true | 3.0 |
### 事件