Question

我有一个通过state.posts.x

访问的reducer

看起来像这样：

export default function (state = {}, action) {
switch(action.type){
    case FETCH_PUBLISHED_POSTS_REQUEST:
        return {
            ...state,
            isFetching: true
        }
    case FETCH_PUBLISHED_POSTS_SUCCESS:
        return {
            ...state,
            publishedPosts: action.publishedPosts,
            isFetching: false
        }
    case FETCH_SINGLE_POST_REQUEST:
        return {
            ...state,
            isFetching: true
        }
    case FETCH_SINGLE_POST_SUCCESS:
        return {
            ...state,
            singlePost: action.singlePost,
            isFetching: false
        }
    default:
        return state;
    }
}

在我的组件中，我将状态映射到props以检查isFetching。我遇到的问题是，只要调用了publishPosts或singlePost，isFetching就会变为“true”，所以我的UI在不应该显示加载状态时显示。

解决这个问题的最佳方法是什么？将它分成两个减速器是没有意义的。更改isFetching的名称以使其唯一（即isFetchingPublishedPosts）似乎也适得其反。

Answer 1

您的组件应该只接收其关注的州的一部分。如果isFetching不应该影响组件，则将其从组件的mapStateToProps函数中删除：

const mapStateToProps = state => ({ myprop: state.importantStateForTheComponent })

在此示例中，如果州中有importantStateForTheComponent字段，您的组件将作为道具接收，但它会忽略对state.isFetching的任何更改。

redux reducer中的多个isFetching实例

1 个答案: