小编Tho*_*nte的帖子

React redux normalizr:如何处理嵌套实体?

假设我有一个这样的结构,这是从API获取并在我的实体上使用"normalizr"的结果:

entities: {
    users:{
        1: {
            name: 'John',
            posts: [ 1, 4 ]
        }
    },
    posts: {
        1: {
            name: 'First Post',
        },
        4: {
            name: 'Second Post',
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

现在我有一个按用户过滤帖子的方法,基本上可以这样做:

let filteredPosts = {};
entities.users.posts.forEach(key => {
    if(posts.hasOwnProperty(key))
        filteredPosts[key] = posts[key]
});
Run Code Online (Sandbox Code Playgroud)

以及显示该用户帖子的页面,例如:

render() {
    return(
        <div>
            {Object.keys(filteredPosts).map(key => {
                return (
                    <div>{filteredPosts[key].name}</div>
                );
            })}
        </div>
    )
}
Run Code Online (Sandbox Code Playgroud)

我的实体reducer非常简单:

import { merge } from 'lodash';
...
function entities(state = { users: {}, posts: {} }, action) {
    if …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs redux normalizr

5
推荐指数
1
解决办法
2602
查看次数

标签 统计

javascript ×1

normalizr ×1

reactjs ×1

redux ×1