score:1
simply pass both state and props from your mapstatetoprops
to your selectors.
if you use a selector directly as the mapstatetoprops function, it will receive the same arguments mapstate does: state
and ownprops
(props set on the connected component).
a simple example:
// simple selector
export const getsomethingfromstate = (state, { id }) => state.stuff[id]
// reselect selector
export const getstuff = createselector(
getsomethingfromstate,
(stuff) => stuff
)
// use it as mapdispatchtoprops
const mapdispatchtoprops = getsomethingfromstate
const mycontainer = connect(mapdispatchtoprops)(mycomponent)
// and set id as an own prop in the container when rendering
<mycontainer id='foo' />
however you're doing some weird things like mapping a selector to reuse it later. it doesn't work that way, at least it's not intended to be used that way.
you use selectors to retrieve slices of your state and pass it as props to your connect
ed components. whenever the state changes, your selectors will be re-run (with some caching thanks to reselect). if something the component is actually retrieving from redux has changed indeed, it will re-render.
so your featureeditdialog
component should be connected as well, and should be capable of retrieving anything it needs from the redux state, just by using props (which feature, which id, so on) in its own connect
call.
this.props.showdialog(dialog);
is a big code smell as well. ;)
Source: stackoverflow.com
Related Query
- pass props to selectors to filter based on that props
- How to pass additional props throughout a Route element that has parameters in a Typescript based React Web Application
- Component not updating when I change the props that I pass to it in React
- How to pass props to react component that wrapped in variable
- When calling super() in custom view, make sure to pass up the same props that your component's constructor was passed
- ReactJS error: make sure to pass up the same props that your component's constructor was passed
- React - Pass function to component that has default props
- How to pass dynamic props to a React component that accepts a union of objects as its type?
- Pass props from parent to child component that uses hooks?
- Why is typescript triggering an error in my HOC that uses rest props when I try to pass another prop?
- React useState with state that updates based on props
- How to pass on data that are fetched from Firestore as props to a component
- Reusing a variable that is based on multiple redux props without duplication of code
- Dynamically create nth-child selectors based on props to a Material-UI component
- How to pass down certain props based off of certain screen size
- React - how to pass component and props to children component and make that component use that props
- Trying to write a function that can accept an optional parameter and based on it's type, filter and return an icon
- React - Create connected provider arround default provider, that will take data from store and pass it as props to default provider
- Conditionally pass props to child based on component type
- Reactjs pass props based on loaded component
- FIlter an Object based on a key and get the value for that key
- Pass props to function that is spread within an object
- TypeError: Cannot read property 'props' of undefined - even that i pass some data in props to that component
- How to pass a json array that comes from backend to child component using props and react hooks?
- Is creating a single input component that changes its type based on props and supports all input types feasible? Or would the component become complex
- how can I change props of component that pass from higher component . reactjs
- Can I pass props as a function argument or if that is a bad practice?
- How can I match data from an object and pass it as props to another component that displays dynamically?
- Javascript: How do you filter search results based on multiple values (regardless of the order that the words are typed)
- React: filter array: Can I work with elements that didn't pass the test?
More Query from same tag
- How to use getElementsByClassName on dynamic html
- Sinon spy for named exports in ES6
- Cannot get inline style to work in React
- Can I use HOC to wrap component with graphql and redux
- Redux loses state when navigating to another page in Next.js
- react Child component not receiving props
- wait for multiple API calls to finish using useAxios custom hook
- Context compatible React hook for routing
- Dynamic page title with ReactJS
- Reseting/clearing antd RangePicker (React)
- Multiple fetch requests with setState in React
- React : Updating and then accessing state after a network request in useEffect hook. State remains stale
- non empty array with length=0 in Meteor
- Tailwind Container Not Working at SM Devices
- Correct modification of state arrays in React.js
- Dynamically Constructed and Deeply Nested Forms in React
- ReactJS - setting state in an arrow function
- Display API data on other react pages
- Accessing params with react-router-redux
- React js : items never fed in infinite scroll (now with simpler example)
- I need to manage state for each tab in react
- Dynamically change the column name based on inputs
- React: Timeout - Async callback was not invoked within timeout specified by jasmine.DEFAULT_TIMEOUT_INTERVAL
- Generic Props for Typescript type check
- Is there literally any way to get whitespace filenames to work with <img src="...">?
- What's the right way of defining event handler in ReactJS Component?
- Is setState() inside componentDidMount() considered an anti-pattern
- Update in one setState property causes another property change automatically in reactjs
- How to pass variable outside method's scope in react?
- I cannot optimize the design for the mobile version