Posts

Showing posts with the label redux

Can't get store value after the value was updated using React

Can't get store value after the value was updated using React I have a SearchBar component and it has a subcomponent SearchBarItem. I passed the method handleSelectItem() to subcomponent to dispatch value to store and it works (I saw it from the Redux tool in Chrome). handleSelectItem() Then, when I tried to get the value from the method submitSearch() , which I also passed it from the parent component, it shows: submitSearch() Cannot read property 'area' of undefined. I'm still not so familiar with React. If someone can help, it will be very appreciated. Thanks in advance. This is parent component SearchBar: class SearchBar extends Component { handleSelectItem = (selectCategory, selectedItem) => { if (selectCategory === 'areas') { this.props.searchActions.setSearchArea(selectedItem); } } submitSearch() { console.log(this.props.area); // this one is undefined } render() { return ( <div className="searchBar...

How to return redux state to initial state?

How to return redux state to initial state? I'm having surprisingly difficult time figuring this out, essentially I'm trying to set state to initial state, so far I tried: // -- Initial state ------------------------------------------------------------ const INITIAL_STATE = { search: { listings: }, listings: } // -- Story structure for story editor ----------------------------------------- export default function(state = INITIAL_STATE, action) { switch(action.type) { case ACTIONS.RESET_STATE: return { ...state, INITIAL_STATE } default: return state; } } this just adds initial state to existing one case ACTIONS.RESET_STATE: return { ...state, state = INITIAL_STATE } this returns error case ACTIONS.RESET_STATE: return { ...state, state: INITIAL_STATE } this is adding initial state to existing one gain case ACTIONS.RESET_STATE: return { ...state, search: { listings: }, listings: } This works, but I start getting weird mutation e...

NgRx - Reducers priority and execution order against store

NgRx - Reducers priority and execution order against store If different reducers are associated to the same action and are performing changes to the store, are they receiving the same version of it before any edit happens? Is there a priority to consider? Example: Lets assume you dispatch an action Update to edit an entity on server side, once data is successfully updated, an effect will dispatch an Update_Success action with an instance of the newly received version of entity as payload. A first classic and logical reducer will use it to update the store: Update Update_Success case ItemActionTypes.UPDATE_ITEM_SUCCESS: { const item = action.payload; return { ...adapter.upsertOne(item, state), loaded: true, loading: false }; } Now lets assume that in a different file, you have a different reducer associated to the same action and needs to compare the newly received entity against the old one in store: case ItemActionTypes.UPDATE_ITEM_SUCCESS: { const item =...

using states in a react-navigation without redux

using states in a react-navigation without redux as written in the react-navigation page: Warning: in the next major version of React Navigation, to be released in Fall 2018, we will no longer provide any information about how to integrate with Redux and it may cease to work. In the next version of react-navigation it could be hard to use redux with react-navigation. My question is: what can I do to use states (and passing states between screens) in a react-navigation app without using redux? 2 Answers 2 For children of navigator react-navigation gives you an withNavigation HOC, so you can easily wrap the component inside it to access the navigation state and navigate. withNavigation Why you integrate react navigation with redux? For me, I want to be able to perform navigation actions from outside of my components(screens). Eg: Redux-saga. If we don't integrate, we can't navigate via red...