fix: 修复redux-thunk报错问题

src/components/Menu/index.tsx

@@ -3,22 +3,28 @@ import { asyncLogout } from '@/store/modules/user'
 import { RootState } from '@/store/reducers'
 import { iMenuItem } from '@/types/router'
 import { Button, Dropdown, Menu } from "antd"
-import React from 'react'
+import React, { useEffect } from 'react'
 import { connect } from 'react-redux'
 import { Link } from "react-router-dom"
-import store from 'store'
+import { Action } from 'redux'
+import { ThunkDispatch } from 'redux-thunk'
 import styles from './index.module.scss'
 import './index.scss'
 import MenuItem from './MenuItem'
 interface iMenuProps {
-  list: iMenuItem[],
+  list: iMenuItem[]
   username: string
+  logoutClick? :() => void
 }
 
 const NavSider:React.FC<iMenuProps> = (props)=> {
-  const { list: MeunList, username } = props
-
+  const { list: MeunList, username, logoutClick } = props
 
+  useEffect(() => {
+    return () => {
+      logoutClick && logoutClick()
+    }
+  }, [])
   return (
     <div className="main-nav">
       <div className="logo"><img src={logo}></img></div>
@@ -37,7 +43,26 @@ const NavSider:React.FC<iMenuProps> = (props)=> {
             )
           }
           <div className="pi-text-center">
-            <Dropdown overlay={DropMenu} trigger={[ 'click' ]} placement="topRight">
+            <Dropdown overlay={() => {
+              return (
+                <Menu>
+                  <Menu.Item key="0">
+                    <Link to="/acount/safe">账号资料</Link>
+                  </Menu.Item>
+                  <Menu.Item key="1">
+                    <Link to="/acount/safe">账号安全</Link>
+                  </Menu.Item>
+                  <Menu.Divider />
+                  <Menu.Item key="2">
+                    <Link to="/acount/safe">帮助中心</Link>
+                  </Menu.Item>
+                  <Menu.Item key="3">
+                    <Link to="/login">退出登录</Link>
+                    {/* <span onClick={logoutClick}></span> */}
+                  </Menu.Item>
+                </Menu>
+              )
+            }} trigger={[ 'click' ]} placement="topRight">
               <Button size="small" className={styles.bottomBtn}>{username}</Button>
             </Dropdown>
           </div>
@@ -47,37 +72,25 @@ const NavSider:React.FC<iMenuProps> = (props)=> {
   )
 }
 
-const DropMenu = () => {
+// const DropMenu = () => {
 
-  function deleteUser() {
-    store.dispatch(asyncLogout())
-  }
+//   function deleteUser() {
+//     // store.dispatch(asyncLogout())
+//   }
 
-  return (
-    <Menu>
-      <Menu.Item key="0">
-        <Link to="/acount/safe">账号资料</Link>
-      </Menu.Item>
-      <Menu.Item key="1">
-        <Link to="/acount/safe">账号安全</Link>
-      </Menu.Item>
-      <Menu.Divider />
-      <Menu.Item key="2">
-        <Link to="/acount/safe">帮助中心</Link>
-      </Menu.Item>
-      <Menu.Item key="3">
-        <span onClick={deleteUser}>退出登录</span>
-      </Menu.Item>
-    </Menu>
-  )
-}
 
+// }
 
-const mapStateToProps = (state:RootState) => {
 
+const mapStateToProps = (state:RootState) => {
   return {
     username: state.user.userInfo.Name
   }
 }
 
-export default connect(mapStateToProps)(NavSider)
+const mapDispathToProps = (dispatch: ThunkDispatch<RootState, null, Action>) => {
+  return {
+    logoutClick: () => dispatch(asyncLogout())
+  }
+}
+export default connect(mapStateToProps, mapDispathToProps)(NavSider)

src/store/modules/user/index.ts

@@ -1,6 +1,6 @@
 import { apiLogout } from '@/components/Menu/api'
 import { Action } from 'redux'
-import { ThunkAction } from 'redux-thunk'
+import { ThunkDispatch } from 'redux-thunk'
 import { delUserInfo, getUserInfo, saveUserInfo } from './../../../utils/common/user'
 import { RootState } from './../../reducers'
 import { CHECK_PERMISSION, DEL_USER_INFO, iUserInfo, iUserInfoState, SAVE_USER_INFO, UserInfoActionTypes } from './types'
@@ -49,7 +49,7 @@ export function deleteUserInfo(): UserInfoActionTypes {
       type: DEL_USER_INFO
     }
 }
-export const asyncLogout = ():ThunkAction<void, RootState, null, Action<string>> => async (dispatch) => {
+export const asyncLogout = () => async (dispatch:ThunkDispatch<RootState, null, Action>) => {
   await apiLogout()
   dispatch(deleteUserInfo())
 }