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

fix: space remounted slot, close #6500

pull/6758/head
tangjinzhou 2023-04-27 22:18:35 +08:00
parent 6d1035f1b0
commit 80fbabc66f
1 changed files with 6 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
components/space/index.tsx
View File

@ -1,5 +1,5 @@
import type { PropType, ExtractPropTypes, CSSProperties } from 'vue'; import type { PropType, ExtractPropTypes, CSSProperties } from 'vue';
import { defineComponent, computed, ref, watch } from 'vue'; import { defineComponent, computed, ref, watch, Fragment } from 'vue';
import PropTypes from '../_util/vue-types'; import PropTypes from '../_util/vue-types';
import { filterEmpty } from '../_util/props-util'; import { filterEmpty } from '../_util/props-util';
import type { SizeType } from '../config-provider'; import type { SizeType } from '../config-provider';
@ -80,8 +80,8 @@ const Space = defineComponent({
}); });
return () => { return () => {
const { wrap, direction = 'horizontal' } = props; const { wrap, direction = 'horizontal' } = props;
const children = slots.default?.();
const items = filterEmpty(slots.default?.()); const items = filterEmpty(children);
const len = items.length; const len = items.length;
if (len === 0) { if (len === 0) {
@ -94,6 +94,7 @@ const Space = defineComponent({
return ( return (
<div class={cn.value} style={style.value}> <div class={cn.value} style={style.value}>
{items.map((child, index) => { {items.map((child, index) => {
const originIndex = children.indexOf(child);
let itemStyle: CSSProperties = {}; let itemStyle: CSSProperties = {};
if (!supportFlexGap.value) { if (!supportFlexGap.value) {
if (direction === 'vertical') { if (direction === 'vertical') {
@ -111,7 +112,7 @@ const Space = defineComponent({
} }
return ( return (
<> <Fragment key={originIndex}>
<div class={itemClassName} style={itemStyle}> <div class={itemClassName} style={itemStyle}>
{child} {child}
</div> </div>
@ -120,7 +121,7 @@ const Space = defineComponent({
{split} {split}
</span> </span>
)} )}
</> </Fragment>
); );
})} })}
</div> </div>