I have a search form that fetches data from a api. This is that first time I am using Redux so please excuse my ignorance.
I am able to display the search results in the sidebar without using redux store.
handleSubmit(event) {
event.preventDefault()
get(`api1`, { maxContentLength: 400 })
.then((res) => {
this.setState({SearchItems: res.data})
})
}
There are few steps Manually you can do using below methods of store object from redux'
below method will dispatch action to reducer
store.dispatch({type: 'GET_RESULTS' , payload: {}})
store.subscribe will receive all actions, you can register callbacks here.
store.getState() using this method you can access current state
you can find full documentation and examples at https://redux.js.org/basics/store example with redux is here redux with react
for react application you may use react-redux package to integrate redux which comes with Provider component with store property
with this you can import your global store object in your index.js file where you are creating App component.
With provider component set now you can use
And use Connect higher order component inside your react component to integrate redux actions to react component. Connect accepts two functions mapStateToProps and mapDispatchToProps functions as arguments and returns higher order component to which you pass your react component.
mapStateToProps functions as its name accepts global state and returns object with properties which then can be accessed from props, and similarly mapDispatchToProps accepts dispatchers to props. below is the example of react component integrated with redux using react-redux.
here is video tutorial react-redux video
applyMiddlewareis just a function. What middleware are you using or will use? E.g. Redux-saga or redux-thunk. Also have you created the store?