2016-03-16 4 views
1

Я новичок в синтаксисе redux и es6. Здесь проблема:Обновление состояния в redux

Существует приложение с несколькими сообщениями.

const initialState = { 
    items: { 
    3: {title: '1984'}, 
    6: {title: 'Mouse'}, 
    19:{title: 'War and peace'} 
    } 
} 

App получить массив понравившихся постов идентификаторов:

dispatch(receiveLikedPosts(3, {id:3, ids: [3,6]})); 

function receiveLikedPosts(ids) { 
    return { 
    type: LIKED_POSTS_RECEIVED, 
    ids 
    }; 
} 

Там является редуктор сообщений:

function posts(state = initialState, action) { 
    switch (action.type) { 
    case LIKED_POSTS_RECEIVED: 
    // here I need to update my posts state: post.liked => true (only 3 and 6 post) 
    default: 
    return state; 
    } 
} 

1) я должен обновить свои восстановителей LIKED_POSTS_RECEIVED кода. Не знаю, как это сделать правильно.

2) Правильно ли отправлять события несколько раз? (Одна диспетчерская для каждого понравившегося поста)

Вот код:

// action 
let ids = [3,6] 
for (let id of ids) { 
    dispatch({type: LIKE, id}); 
} 

// reducers 
function post(state, action) { 
    switch (action.type) { 
    case LIKE: 
    return Object.assign({}, state, { 
     liked: true 
    }); 
    default: 
    return state; 
    } 
} 

function posts(state = initialState, action) { 
    switch (action.type) { 
    case LIKE: 
    return Object.assign({}, state, { 
     [action.id]: post(state[action.id], action) 
    }); 
    default: 
    return state; 
    } 
} 
+0

действия не должны вызывать другие действия, но сама передача многих действий - это не плохо. – dandavis

+0

Действия @dandavis «не должны вызывать другие действия» - если вы не используете thunks. – ffxsam

ответ

2

Это сбивает с толку меня:

dispatch(receiveLikedPosts(3, {id:3, ids: [3,6]})); 

function receiveLikedPosts(ids) { 
    return { 
    type: LIKED_POSTS_RECEIVED, 
    ids 
    }; 
} 

Ваша функция receiveLikedPosts принимает только один аргумент, но вы передаете его два. И я не уверен, что должен делать { id: 3, ids: [3, 6] }. Но, вот что я хотел бы сделать:

Исходное состояние и редуктор:

const initialState = { 
    items: { 
    3: { title: '1984', liked: false }, 
    6: { title: 'Mouse', liked: false }, 
    19: { title: 'War and peace', liked: false } 
    } 
}; 

function posts(state = initialState, action) { 
    switch (action.type) { 
    let newItems = {}; 

    case LIKED_POSTS_RECEIVED: 
     // copy the current items into newItems 
     newItems = {...state.items}; 

     // Loop through the liked IDs, set them to liked:true 
     action.ids.forEach((likedId) => { 
     newItems[likedId].liked = true; 
     }); 

     // Return the new state 
     return { 
     ...state, 
     items: newItems, 
     } 
    default: 
     return state; 
    } 
} 

Действие создатель:

function receiveLikedPosts(ids) { 
    return { 
    type: LIKED_POSTS_RECEIVED, 
    ids, 
    }; 
} 

И, наконец, отправка:

dispatch(receiveLikedPosts([3, 6])); 
Смежные вопросы