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

perf: virtual list

pull/5079/head
tangjinzhou 2021-12-23 23:23:01 +08:00
parent 7aae6f675c
commit 4e70c6dd77
3 changed files with 124 additions and 113 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
components/vc-select/OptionList.tsx
View File

@ -7,7 +7,7 @@ import { isValidElement } from '../_util/props-util';
import createRef from '../_util/createRef'; import createRef from '../_util/createRef';
import type { PropType } from 'vue'; import type { PropType } from 'vue';
import { computed, defineComponent, nextTick, reactive, watch } from 'vue'; import { computed, defineComponent, nextTick, reactive, watch } from 'vue';
import List from '../vc-virtual-list/List'; import List from '../vc-virtual-list';
import type { import type {
OptionsType as SelectOptionsType, OptionsType as SelectOptionsType,
OptionData, OptionData,
@ -346,7 +346,8 @@ const OptionList = defineComponent<OptionListProps<SelectOptionsType[number]>, {
onScroll={onScroll} onScroll={onScroll}
virtual={virtual} virtual={virtual}
onMouseenter={onMouseenter} onMouseenter={onMouseenter}
children={({ group, groupOption, data, label, value }, itemIndex) => { v-slots={{
default: ({ group, groupOption, data, label, value }, itemIndex) => {
const { key } = data; const { key } = data;
// Group // Group
if (group) { if (group) {
@ -357,7 +358,15 @@ const OptionList = defineComponent<OptionListProps<SelectOptionsType[number]>, {
); );
} }
const { disabled, title, children, style, class: cls, className, ...otherProps } = data; const {
disabled,
title,
children,
style,
class: cls,
className,
...otherProps
} = data;
const passedProps = omit(otherProps, omitFieldNameList); const passedProps = omit(otherProps, omitFieldNameList);
// Option // Option
const selected = values.has(value); const selected = values.has(value);
@ -425,6 +434,7 @@ const OptionList = defineComponent<OptionListProps<SelectOptionsType[number]>, {
)} )}
</div> </div>
); );
},
}} }}
></List> ></List>
</> </>

5
components/vc-tree/NodeList.tsx
View File

@ -269,7 +269,8 @@ export default defineComponent({
itemHeight={itemHeight} itemHeight={itemHeight}
prefixCls={`${prefixCls}-list`} prefixCls={`${prefixCls}-list`}
ref={listRef} ref={listRef}
children={(treeNode: FlattenNode) => { v-slots={{
default: (treeNode: FlattenNode) => {
const { const {
pos, pos,
data: { ...restProps }, data: { ...restProps },
@ -283,7 +284,6 @@ export default defineComponent({
delete restProps.children; delete restProps.children;
const treeNodeProps = getTreeNodeProps(mergedKey, treeNodeRequiredProps); const treeNodeProps = getTreeNodeProps(mergedKey, treeNodeRequiredProps);
return ( return (
<MotionTreeNode <MotionTreeNode
{...restProps} {...restProps}
@ -305,6 +305,7 @@ export default defineComponent({
}} }}
/> />
); );
},
}} }}
></VirtualList> ></VirtualList>
</> </>

2
components/vc-virtual-list/List.tsx
View File

@ -398,7 +398,7 @@ const List = defineComponent({
virtual, virtual,
component: Component = 'div', component: Component = 'div',
onScroll, onScroll,
children, children = this.$slots.default,
style, style,
class: className, class: className,
...restProps ...restProps