reactjs - React Action Creator 和 Action 类型命名约定?

标签 reactjs redux

是否有关于命名 action creators 和 action.types 的官方命名约定

查看教程, Action 创建者和 Action 类型的主题是为 Action 类型命名,几乎与 Action 创建者一一对应。

举个例子,假设我们有一个获取博客文章的应用程序

本教程(评分最高的 Udemy 教程)使用了以下异步 Action 创建器的命名约定:

export const fetchPosts = () => async dispatch => {
    const response = await postsAPI.get('/posts');

    dispatch({type: 'FETCH_POSTS', payload: response.data});
};

但是,将操作对象更准确地命名为正在分派(dispatch)的对象(以表示成功或失败)不是更有意义吗?不是将 Action 创建者函数名称与 Action 类型匹配,而是按照以下行:

export const fetchPosts = () => async dispatch => {
    const response = await postsAPI.get('/posts');
    
    if (response.status === 200) {
       dispatch({type: 'FETCHED_POSTS', payload: response.data});
    } else {
        dispatch({type: 'FAILED_TO_FETCH_POSTS', payload: response});
    }
};

最佳答案

是的,官方风格指南建议write action types as domain/eventname .

这与风格指南中的其他一些内容一起出现。

除此之外,当它们描述应用程序中发生的事情或用户所做的事情时,我更喜欢我的 Action 像 todos/added 一样过去,并且像 todos/save 当他们描述应该在中间件中处理的副作用时(然后可能会执行 API 请求并最终以 todos/save 操作实际引导到 reducer 的变化)。

还有一些事情是由 RTK 隐式完成的,例如 createAsyncThunk将为每个 thunk 自动创建三个 Action : yourActionPrefix/pendingyourActionPrefix/fulfilledyourActionPrefix/rejected

关于reactjs - React Action Creator 和 Action 类型命名约定?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/65695688/

相关文章:

reactjs - firebase2.default.firestore 不是一个函数 - React Firebase

node.js - 如何在没有 create-react-app 的情况下手动配置 React 的最小设置?

javascript - 如何将变量从函数传递到 react 中的渲染函数

javascript - 如何在 React Native 上使用 TextInput 中从 Api 获取数据?

javascript - Material-UI 文本字段和 Redux 状态尝试设置默认值的奇怪行为?

reactjs - 调度和bindActionCreators有什么区别?

reactjs - 无法使用 axios 发送 auth header

javascript - 在 useEffect 中设置状态

javascript - 使用子组件的数据从组件分派(dispatch)操作

javascript - Angular 2 ngrx : how to update an array which is embedded in one the the items of my state array?