Reactjs React使用Redux更新状态，但不更新组件

我有一个博客应用程序，我想按投票或标题对我的文章进行排序，因此我有以下用于排序的按钮：

<Button size='mini' onClick={() => {this.props.sortByVotes()}}>
    Votes
</Button>
<Button size='mini' onClick={() => {this.props.sortByTitle()}}>
    Title
</Button>

减速器如下所示：

case SORT_BY_VOTES:
    return {
        ...state,
        posts: state.posts.sort((a, b) => b.voteScore - a.voteScore)
    }
case SORT_BY_TITLE:
    return {
        ...state,
        posts: state.posts.sort((a, b) => {
            if (a.title > b.title) return 1
            if (a.title < b.title)return -1
            return 0
        })
    }

正如你所看到的，这里没有什么特别的

问题是：状态按预期更新，但视图未更新

我现在还不知道如何解决它，以及为什么会发生这种情况

---

任何帮助都将不胜感激。

您的操作不会发送有效负载。您是否在操作中启动API调用以发送给减速机？在reducer中，您需要从操作中捕获负载，然后更新状态

行动： 减速器：

因此，常见的工作流是在actions中有一个参数，然后在reducer中修改默认状态。参考上面的示例

---

希望这有帮助。

对象帖子没有更改，因此React没有渲染组件

我添加了一个变通解决方案

reducers/posts.js

案例按投票排序： const posts=Object.assign{}，{posts:state.posts.sorta，b=>b.voteScore-a.voteScore }

---

返回Object.assign{}，state，posts；您能分享一下您是如何将Redux状态绑定到视图部件的吗。我认为问题在于绑定方法。我认为您要问的是最后两个片段，它们位于主视图中。。挂载主视图时，我调用this.props.getPosts，在mapDispatchToProps中我有这样一个：getPosts:=>DispatchFetchPosts是否可以共享整个代码是codesandbox并共享链接？我可以重构代码。github可以处理吗？不要将索引整数用作键。那可能是你的问题。在本例中的更改操作类型定义要执行的操作：如果已调度sortByVotes，则它将按投票按降序排序，而不会显示有效负载为{byVotes:true}或其他内容。MapStateTops中的console.logstate为您提供了什么？我以前没有对此进行调试。。它给了我正确的状态，正如它应该的那样，根据选择的排序方法进行排序。但是道具不会传递给重新渲染的子对象。那么我建议您检查componentWillReceiveProps方法中的下一步。如果nextProps有数据，那么就用它来填充。但是为什么React不自己检查呢？这让我很感兴趣，因为当它有了新的道具时，默认的行为是rerender，不幸的是，这个生命周期方法被弃用了

case SORT_BY_VOTES:
    return {
        ...state,
        posts: state.posts.sort((a, b) => b.voteScore - a.voteScore)
    }
case SORT_BY_TITLE:
    return {
        ...state,
        posts: state.posts.sort((a, b) => {
            if (a.title > b.title) return 1
            if (a.title < b.title)return -1
            return 0
        })
    }

<Item.Group divided>
    {this.props.posts.map((p, idx) =>
        <PostSmall key={idx}
            id={p.id}
            title={p.title}
            body={p.body}
            category={p.category}
            voteScore={p.voteScore}
        />
    )}
</Item.Group>

function mapStateToProps(state) {
    return {
        posts: state.posts.posts,
        categories: state.categories.categories
    }
}