score:1
Accepted answer
you should forward (or proxy) the id to the action creator
const mapdispatchtoprops = dispatch => ({
addmarket: () => dispatch(actions.addmarket()),
addcard: (id) => dispatch(actions.addcard(id)) // <-- pass id to action creator
});
ui, now passing props.id
will work.
onclick={() => props.addcard(props.id)}
fun fact: you might not need the mapdispatchtoprops function
the redux connect
hoc will automagically wrap actions in mapdispatchtoprops
in a call to dispatch
, so you can write a mapdispatchtoprops
that looks like this
const mapdispatchtoprops = {
addmarket: actions.addmarket,
addcard: actions.addcard
};
and since the function signature of addcard
already takes an id
export const addcard = (marketid) => ({
type: types.add_card,
payload: marketid,
});
then your onclick
code will still work as expected.
Source: stackoverflow.com
Related Query
- Passing a prop into an action creator in Redux
- Dependency Injection in a redux action creator
- React Redux : Action creator not calling reducer
- Redux - how to call an action creator from inside another action creator?
- Best practice when passing Redux state into components
- How do I test a Redux action creator that only dispatches other actions
- Why not dispatch directly into store from action creator redux?
- How to fetch data with multiple requests in Redux action creator and then send collected data to reducer?
- Chaining redux action creator Promise.then() in react component
- Passing multiple functions into mapDispatchToProps in redux connect function
- Why is Redux passing dispatch into the return function of an action?
- Redux action creator syntax
- Passing a Redux Action to a child component with props
- Idiomatic way to dispatch an action on a subcomponent in react redux without passing in props all the way through
- Redux Thunk + ReactJS: Action creator being called but dispatch function not being called
- React Redux action not entering into dispatch
- How to turn redux-thunk action creator into Promise?
- React redux multiple requests in one action creator
- Passing a 'label' prop into Formik <Field /> when using alongside Material UI <TextField />
- Passing callback/promise to action creator from component
- Gets icon prop and passing it into styled() function
- How to take parameters from component to redux action creator
- React Hooks and Redux - trouble getting value from action creator
- Redux Thunk Action Creator Not Getting Called
- How to access async function from Redux Action passed into Redux Thunk?
- passing data to an action creator and returning a property value
- Trouble disabling react-hooks/exhaustive-deps warning when using redux action creator inside useEffect hook
- How to handle repetitive action creator boilerplate in Redux
- Passing values into the `next` function in Redux Saga
- React redux using state within an action creator
More Query from same tag
- My icons dont show up (Material-ui). Can someone guide me on how should I fix it?
- How to generically type React component props and extend the generic props type
- static getDerivedStateFromProps that requires previous props and state callback?
- Nginx: serve multiple React applications on the same server
- MediaStream not connecting to MediaElement
- in react hooks, onChange not firing if the user select the same value
- If I add PropTypes, do I need to check typeof?
- Display JSON child content to HTML table in Reactjs
- Avoid select tag's value being reset to default when changing selected option values through React state
- Material UI Typography & Media Queries in
- Getting not wrapped in act error despite already wrapped
- Why I need to provide the location object to Switch component to make exit animation work?
- GatsbyJS: StatiscQuery pass in data from current page
- React update dropdown menu siblings with leftover items
- JSX.Element is not assignable to parameter of type ForwardRefRenderFunction
- Easing animation using React and Styled Components
- Where's hashHistory in React Router v4?
- How can I get the state value in the reducer of createSlice?
- Dynamic reference to a google font from react app
- I've problem with react typescript code in .tsx file
- sending data in correct format from react to node
- d3.js horizontal Bar chart issue
- Updating object in array hook react js
- React: .map is not a function
- JQuery not working in React view without reload
- Router with render not passing props in another component
- Error when converting a class component to a functional component
- Why objects props passed to child components are 'undefinded' but primitives work?
- How to automatically fetch data from json server when data gets updated in it in react js
- Is there any easy way of making "componentDidUpdate()" lifeycycle method from ONLY JavaScript?