1
1
import type { PropType , ExtractPropTypes , CSSProperties } from 'vue' ;
2
- import { defineComponent , computed , ref , watch } from 'vue' ;
2
+ import { defineComponent , computed , ref , watch , Fragment } from 'vue' ;
3
3
import PropTypes from '../_util/vue-types' ;
4
4
import { filterEmpty } from '../_util/props-util' ;
5
5
import type { SizeType } from '../config-provider' ;
@@ -80,8 +80,8 @@ const Space = defineComponent({
80
80
} ) ;
81
81
return ( ) => {
82
82
const { wrap, direction = 'horizontal' } = props ;
83
-
84
- const items = filterEmpty ( slots . default ?. ( ) ) ;
83
+ const children = slots . default ?. ( ) ;
84
+ const items = filterEmpty ( children ) ;
85
85
const len = items . length ;
86
86
87
87
if ( len === 0 ) {
@@ -94,6 +94,7 @@ const Space = defineComponent({
94
94
return (
95
95
< div class = { cn . value } style = { style . value } >
96
96
{ items . map ( ( child , index ) => {
97
+ const originIndex = children . indexOf ( child ) ;
97
98
let itemStyle : CSSProperties = { } ;
98
99
if ( ! supportFlexGap . value ) {
99
100
if ( direction === 'vertical' ) {
@@ -111,7 +112,7 @@ const Space = defineComponent({
111
112
}
112
113
113
114
return (
114
- < >
115
+ < Fragment key = { originIndex } >
115
116
< div class = { itemClassName } style = { itemStyle } >
116
117
{ child }
117
118
</ div >
@@ -120,7 +121,7 @@ const Space = defineComponent({
120
121
{ split }
121
122
</ span >
122
123
) }
123
- </ >
124
+ </ Fragment >
124
125
) ;
125
126
} ) }
126
127
</ div >
0 commit comments