Javascript 使用redux钩子时，使用redux操作的最佳选项是什么？

我想使用redux钩子useSelector来访问存储并去掉connect（），所以我需要创建一种方法来导出我的动作，我正在考虑一个带有静态方法的类，下面是一个示例

export default class AuthActions {
    static async login(userData) {
        try {
            const user = await axios.post('http://localhost:5000', userData);

            dispatch({
                type: AUTH.LOGIN,
                payload: user.data
            })
        } catch (error) {
            dispatch({
                type: SET_ERROR,
                payload: error
            })
        }
    }

    static setUser() {
        console.log("SET USER")
    }

    static logout() {
        console.log("Logout")
    }
}

然后我使用如下的行动方法：

import React from 'react';
import AuthActions from '../../redux/actions/AuthActions';
import { useSelector } from 'react-redux';


export default const Login = () => {
  //More logic....
  const { isAuth } = useSelector((state) => state.auth);

  const submitHandler = e => {
    e.preventDefault();
    AuthActions.login(userData)
  }

  return (
    <form onSubmit={submitHandler}>
      My Login form ....
    </form>
  );
};

从“React”导入React；
从“../../redux/actions/AuthActions”导入AuthActions；
从'react redux'导入{useSelector}；
导出默认常量登录=（）=>{
//更多的逻辑。。。。
const{isAuth}=useSelector（（state）=>state.auth）；
常量submitHandler=e=>{
e、 预防默认值（）；
authoctions.login（userData）
}
返回(
我的登录表单。。。。
);
};

但是我想知道以这种方式使用redux是否有缺点或性能问题，或者我应该避免使用类而使用简单对象吗

---

提前感谢

这是我的减速机格式，灵感来自 例如，检查此暗模式缩减器：

export const constants = {
  TOGGLE: "darkMode/TOGGLE"
};

export const actions = {
  toggleDarkMode: () => {
    return {
      type: constants.TOGGLE
    };
  }
};

export const thunks = {
  toggleDarkMode: () => {
    return (dispatch, getState) => {
      dispatch(actions.toggleDarkMode());
      const isDark = getState().darkMode.isDark;
      localStorage.setItem("isDark", isDark);
    };
  }
};

const initialState = { isDark: localStorage.getItem("isDark") === "true" };

export default (state = initialState, action) => {
  switch (action.type) {
    case constants.TOGGLE:
      return {
        isDark: !state.isDark
      };
    default:
      return state;
  }
};

---

有些东西不起作用了吗？不要担心“最佳选择”，甚至不要在动手之前尝试优化。但是，如果区分

操作

和

thunks

则会使消费者代码对实现细节了解得太多。如果您的操作被推迟或需要发送XHR，您也必须更新消费者组件。将所有内容都保存在一个列表中可以很容易地更改。我只在组件/挂钩上使用thunk。动作在thunks中使用