--- id: 5a24c314108439a4d4036151 title: Use a Switch Statement to Handle Multiple Actions challengeType: 6 isRequired: false forumTopicId: 301449 localeTitle: Использование инструкции Switch для обработки нескольких действий --- ## Description
Вы можете сказать хранилищу Redux, как обрабатывать несколько типов действий. Предположим, что вы управляете аутентификацией пользователя в своем хранилище Redux. Вы хотите,чтобы у вас было состояние, показывающее когда пользователи вошли в систему и когда они вышли из системы. Вы представляете это единственным объектом состояния со свойством authenticated. Вам также нужны создатели действий, которые создают действия, отвечающие за вход пользователя и за выход пользователя из системы, а также сами объекты действий.
## Instructions
В редакторе кода для вас уже описаны хранилище, действия и создатели действия. Заполните функцию reducer для обработки различных действий аутентификации. Используйте JavaScript оператор switch в reducer чтобы реагировать на различные события действий. Это стандартный паттерн при описание редукторов Redux. Оператор switch должен переключаться между action.type и возвращать соответствующее состояние аутентификации. Примечание. На этом этапе не беспокойтесь о неизменности состояния, поскольку это маленький и простой пример. Для каждого действия вы можете вернуть новый объект - например, {authenticated: true} . Кроме того, не забудьте написать случай по умолчанию default в вашем операторе switch, который возвращает текущее state . Это важно, потому что когда в вашем приложении несколько редукторов, все они запускаются, когда происходит отправка действий, даже если действие не связано с этим редуктором. В таком случае вы хотите убедиться, что вы вернете текущее state .
## Tests
```yml tests: - text: Calling the function loginUser should return an object with type property set to the string LOGIN. testString: assert(loginUser().type === 'LOGIN'); - text: Calling the function logoutUser should return an object with type property set to the string LOGOUT. testString: assert(logoutUser().type === 'LOGOUT'); - text: The store should be initialized with an object with an authenticated property set to false. testString: assert(store.getState().authenticated === false); - text: Dispatching loginUser should update the authenticated property in the store state to true. testString: assert((function() { const initialState = store.getState(); store.dispatch(loginUser()); const afterLogin = store.getState(); return initialState.authenticated === false && afterLogin.authenticated === true })()); - text: Dispatching logoutUser should update the authenticated property in the store state to false. testString: assert((function() { store.dispatch(loginUser()); const loggedIn = store.getState(); store.dispatch(logoutUser()); const afterLogout = store.getState(); return loggedIn.authenticated === true && afterLogout.authenticated === false })()); - text: The authReducer function should handle multiple action types with a switch statement. testString: getUserInput => assert( getUserInput('index').toString().includes('switch') && getUserInput('index').toString().includes('case') && getUserInput('index').toString().includes('default')); ```
## Challenge Seed
```jsx const defaultState = { authenticated: false }; const authReducer = (state = defaultState, action) => { // change code below this line // change code above this line }; const store = Redux.createStore(authReducer); const loginUser = () => { return { type: 'LOGIN' } }; const logoutUser = () => { return { type: 'LOGOUT' } }; ```
## Solution
```jsx const defaultState = { authenticated: false }; const authReducer = (state = defaultState, action) => { switch (action.type) { case 'LOGIN': return { authenticated: true } case 'LOGOUT': return { authenticated: false } default: return state; } }; const store = Redux.createStore(authReducer); const loginUser = () => { return { type: 'LOGIN' } }; const logoutUser = () => { return { type: 'LOGOUT' } }; ```