3.6 KiB
3.6 KiB
id | title | challengeType | isRequired | videoUrl | localeTitle |
---|---|---|---|---|---|
5a24c314108439a4d4036155 | Send Action Data to the Store | 6 | false | Enviar dados de ação para a loja |
Description
type
. Você também pode enviar dados específicos junto com suas ações. Na verdade, isso é muito comum porque as ações geralmente se originam de alguma interação do usuário e tendem a carregar alguns dados com elas. A loja Redux geralmente precisa saber sobre esses dados. Instructions
notesReducer()
básico e um criador de ação addNoteText()
definidos no editor de código. Conclua o corpo da função addNoteText()
para que ele retorne um objeto de action
. O objeto deve incluir uma propriedade de type
com um valor de ADD_NOTE
e também uma propriedade de text
definida como os dados da note
transmitidos para o criador da ação. Quando você chama o criador de ações, você passa informações de notas específicas que você pode acessar para o objeto. Em seguida, termine de escrever a instrução switch
no notesReducer()
. Você precisa adicionar um caso que manipule as ações addNoteText()
. Este caso deve ser acionado sempre que houver uma ação do tipo ADD_NOTE
e deve retornar a propriedade text
na action
entrada como o novo state
. A ação é despachada na parte inferior do código. Quando terminar, execute o código e observe o console. Isso é tudo o que é necessário para enviar dados específicos da ação para a loja e usá-los quando você atualizar o state
loja. Tests
tests:
- text: O criador da ação <code>addNoteText</code> deve retornar um objeto com o <code>type</code> e o <code>text</code> chaves.
testString: 'assert((function() { const addNoteFn = addNoteText("__TEST__NOTE"); return addNoteFn.type === ADD_NOTE && addNoteFn.text === "__TEST__NOTE" })(), "The action creator <code>addNoteText</code> should return an object with keys <code>type</code> and <code>text</code>.");'
- text: Despachar uma ação do tipo <code>ADD_NOTE</code> com o criador da ação <code>addNoteText</code> deve atualizar o <code>state</code> para a cadeia passada para o criador da ação.
testString: 'assert((function() { const initialState = store.getState(); store.dispatch(addNoteText("__TEST__NOTE")); const newState = store.getState(); return initialState !== newState && newState === "__TEST__NOTE" })(), "Dispatching an action of type <code>ADD_NOTE</code> with the <code>addNoteText</code> action creator should update the <code>state</code> to the string passed to the action creator.");'
Challenge Seed
const ADD_NOTE = 'ADD_NOTE';
const notesReducer = (state = 'Initial State', action) => {
switch(action.type) {
// change code below this line
// change code above this line
default:
return state;
}
};
const addNoteText = (note) => {
// change code below this line
// change code above this line
};
const store = Redux.createStore(notesReducer);
console.log(store.getState());
store.dispatch(addNoteText('Hello!'));
console.log(store.getState());
Solution
// solution required