fix: fix activeKay props issue.

Author: jaywcjlove

core/src/Tabs.tsx

@@ -1,4 +1,4 @@
-import React, { FC, isValidElement, PropsWithChildren, useEffect, useLayoutEffect, useMemo } from 'react';
+import React, { FC, isValidElement, PropsWithChildren, useLayoutEffect } from 'react';
 import { useDrop } from 'react-dnd';
 import { useDataContext, InitialState } from './store';
 import { ItemTypes } from './Tab';
@@ -10,10 +10,6 @@ export const Tabs: FC<PropsWithChildren<TabsProps>> = ({ children, activeKey, ..
     accept: ItemTypes.Tab,
   }));
 
-  useMemo(() => {
-    dispatch!({ activeKey });
-  }, [activeKey]);
-
   useLayoutEffect(() => {
     if (children) {
       const data: InitialState['data'] = [];

core/src/index.tsx

@@ -1,5 +1,5 @@
 import { DndProvider } from 'react-dnd';
-import { FC, PropsWithChildren } from 'react';
+import { FC, PropsWithChildren, useEffect, useState } from 'react';
 import { HTML5Backend } from 'react-dnd-html5-backend';
 import { Tabs } from './Tabs';
 import { Provider } from './store';
@@ -17,13 +17,17 @@ export interface TabsProps extends React.DetailedHTMLProps<React.HTMLAttributes<
   onTabDrop?: (id: string, index?: number) => void;
 }
 
-const TabContainer: FC<PropsWithChildren<TabsProps>> = ({ activeKey, onTabClick, onTabDrop, ...props }) => {
+const TabContainer: FC<PropsWithChildren<TabsProps>> = ({ activeKey: keyId, onTabClick, onTabDrop, ...props }) => {
   const tabClick = useEventCallback(onTabClick!);
   const tabDrop = useEventCallback(onTabDrop!);
+  const [activeKey, setActiveKey] = useState(keyId);
+
+  useEffect(() => setActiveKey(keyId), [keyId]);
+
   return (
     <DndProvider backend={HTML5Backend}>
       <Provider init={{ data: [], activeKey, onTabClick: tabClick, onTabDrop: tabDrop }}>
-        <Tabs {...props} activeKey={activeKey} />
+        <Tabs {...props} />
       </Provider>
     </DndProvider>
   );