javascript - 用于动态创建项目的 reducer

Question

在减少动态创建项的状态方面，Redux 中是否有任何特定的“良好实践”？在这种特殊情况下，我正在处理可能随时加入/离开应用程序、牌 table 和游戏的用户列表。

let userReducer = (user, action) => {
    switch(action.type) {
        case 'table:create':
        case 'table:join': return {
            ...user,
            tables: [...user.tables, action.tableId]
        }
        case 'table:leave': return {
            ...user,
            tables: user.tables.filter(tableId => tableId != action.tableId)
        };
        case 'game:join': return {
            ...user,
            games: [...user.games, action.gameId]
        };
        case 'game:leave': return {
            ...user,
            games: user.games.filter(gameId => gameId != action.gameId)
        };
    }
}

let usersById = (users = {}, action) => {
    let user = users[action.userId];

    switch(action.type) {
        case 'user:join': return {
            ...users, 
            [action.user.id]: action.user
        };
        case 'user:leave': {
            users = {...users};

            delete users[action.userId];

            return users;
        };
        case 'table:create':
        case 'table:join':
        case 'table:leave':
        case 'game:join':
        case 'game:leave': return {
            ...users,
            [action.userId]: userReducer(user, action)
        };
    }

    return users;
}

第二个函数的 switch 语句中的最后五种情况对我来说看起来特别难看。也许我可以用 if 来浓缩它？ (如果定义了 user，则对其应用 userReducer)。

let usersById = (users = {}, action) => {
    let user = users[action.userId];

    if(user)
        return {
            ...users,
            [user.id]: userReducer(user, action);
        }

    switch(action.type) {
        case 'user:join': return {
            ...users, 
            [action.user.id]: action.user
        };
        case 'user:leave': {
            users = {...users};

            delete users[action.userId];

            return users;
        };
    }

    return users;
}

Answer 1

我认为没有任何好的实践来创建 reducer 。

我个人更喜欢使用第一个示例的方法，因为它使您的代码更具可读性。此外，它还允许您对所有 reducer 保持相同的结构。