fix: Space children remount. close #26177 (#26219)

* fix: Space children remount. close #26177

* update snapshots

components/space/__tests__/__snapshots__/demo.test.js.snap

@@ -395,6 +395,12 @@ exports[`renders ./components/space/demo/debug.md correctly 1`] = `
       </button>
     </span>
   </div>
+  <div
+    class="ant-space-item"
+  />
+  <div
+    class="ant-space-item"
+  />
   <div
     class="ant-space-item"
     style="margin-right:8px"

components/space/__tests__/index.test.js

@@ -1,5 +1,6 @@
-import React from 'react';
+import React, { useState } from 'react';
 import { render, mount } from 'enzyme';
+import { act } from 'react-test-renderer';
 import Space from '..';
 import ConfigProvider from '../../config-provider';
 import mountTest from '../../../tests/shared/mountTest';
@@ -79,4 +80,49 @@ describe('Space', () => {
 
     expect(wrapper.find('.ant-space-item').length).toBe(3);
   });
+
+  it('should be keep store', () => {
+    function Demo() {
+      const [state, setState] = React.useState(1);
+
+      return (
+        <div
+          id="demo"
+          onClick={() => {
+            setState(value => value + 1);
+          }}
+        >
+          {state}
+        </div>
+      );
+    }
+    function SpaceDemo() {
+      const [visible, setVisible] = useState(true);
+      function onChange() {
+        setVisible(!visible);
+      }
+      return (
+        <Space>
+          {visible && <div>space</div>}
+          <Demo />
+          <p onClick={onChange}>Three</p>
+        </Space>
+      );
+    }
+    const wrapper = mount(<SpaceDemo />);
+
+    expect(wrapper.find('#demo').text()).toBe('1');
+
+    act(() => {
+      wrapper.find('#demo').simulate('click');
+    });
+
+    expect(wrapper.find('#demo').text()).toBe('2');
+
+    act(() => {
+      wrapper.find('p').simulate('click');
+    });
+
+    expect(wrapper.find('#demo').text()).toBe('2');
+  });
 });

components/space/index.tsx

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import classNames from 'classnames';
-import toArray from 'rc-util/lib/Children/toArray';
 import { ConfigConsumerProps, ConfigContext } from '../config-provider';
 import { SizeType } from '../config-provider/SizeContext';
 
@@ -35,8 +34,7 @@ const Space: React.FC<SpaceProps> = props => {
     ...otherProps
   } = props;
 
-  const items = toArray(children);
+  const len = React.Children.count(children);
-  const len = items.length;
 
   if (len === 0) {
     return null;
@@ -60,13 +58,13 @@ const Space: React.FC<SpaceProps> = props => {
 
   return (
     <div className={cn} {...otherProps}>
-      {items.map((child, i) => (
+      {React.Children.map(children, (child, i) => (
         <div
           className={itemClassName}
           // eslint-disable-next-line react/no-array-index-key
           key={`${itemClassName}-${i}`}
           style={
-            i === len - 1
+            i === len - 1 || child === null || child === undefined
               ? {}
               : {
                   [direction === 'vertical' ? 'marginBottom' : marginDirection]: