28/09/2017 Development / java script

Esse post serve só pra eu lembrar que no REDUX é criado uma unica STORE...maaaaaaas, não é bem assim...a gente pode sim, e aqui abaixo eu tenho o pulo do gato pra usar isso.

import { createStore } from 'redux'

// ISSO É O REDUCER = funcao redutora, entra de um jeito e sai de outro ;-)
function minhaFuncao(state, action){
if(action.type === 'BLABLABLA'){
return state
}

}

const store = createStore(minhaFuncao)

App store={store}

Quando a gente recebe as propriedades do store, usando o REDUX nos temos os métodos

subscribe()
getState()
dispatch()

http://redux.js.org/docs/api/Store.html

O getState() retorna o ultimo valor retornado da funcao redutora

O dispatch({ type: 'BLABLABLA' , payload: 'PAYLOAD'}) ou no ES6 poderia só passar dispatch({ type: 'BLABLABLA' , payload}) que recebe o type que vai ser responsavel por disparar a acao na funcao redutora, e o payload que é o valor.

Só que ficar mandando toda hora dispatch com o type, é uma merda!

Pra resolver esse problema a gente tem o REDUX-THUNK

https://github.com/gaearon/redux-thunk

E dai nosso dispatch ficaria

this.props.store.dispatch(minhaFuncao(meusparametros)) e na minha funcao eu retorno um dispatch

minhafuncao(url){
return dispatch => {
fetch(url).then(resp => {
dispatch({ type: 'BLABLABLA' , resp}) //explosao de variaveis para objetos literais
return resp
})
}
}

Pra isso temos que importar

import ReduxThunk from 'redux-thunk'

mas na hora de criar a store precisamos importar

import { createStore, applyMiddleware(ReduxThunk) } from 'redux'

O lance é que isso não é nada sem esse carinha aqui ó

https://github.com/reactjs/react-redux

import { Provider } from 'react-redux'

E para usar isso é bom a gente declarar as propriedades das classes que vão herdar o nosso store

App.contextTypes = {
store: React.PropTypes.object.isRequired
}

e usar no App store={this.context.store}

E no final a gente usa o npm install generator-electrode :-)