score:0
move condition logic to inside another hook:
const usedashboardorplotter = (condition: boolean) => {
const {statedashboard, actiondashboard} = usedashboard();
const {stateplotter, actionplotter} = useplotter();
return condition ? {statedashboard, actiondashboard} : {stateplotter, actionplotter}
}
const sidebar = () => {
... condition
const {state, action} = usedashboardorplotter(condition);
return (
<div>...</div>
)
}
score:0
you can use like this in same component.
const {state: plottstate, action: plottaction} = useplotter();
const {state: dashboardstate, action: dashboardaction} = usedashboard();
now use plottstate
, plottaction
, dashboardstate
, dashboardaction
Source: stackoverflow.com
Related Query
- Reuse component used in different context in react
- React reuse a component performing different get/post requests based on where used
- React Router V6 - Error: useRoutes() may be used only in the context of a <Router> component
- React js: Error: useLocation() may be used only in the context of a <Router> component
- React Router V6 - useNavigate() may be used only in the context of a <Router> component
- How to reuse React component that has different markup?
- Reuse a react component with different method calls
- how do i reuse a react component but with different colours?
- Value of state within React context not updating when used in another component
- How do I make a React prop only required when used in the context of a Container component with Typescript?
- How can custom Hooks in React have different state names then the state name used by the functional component from which it was called?
- How to make a single react component which can be used iteratively to display different products. Like an e-commerce website
- React Warning: Cannot update a component from inside the function body of a different component
- What is React component 'displayName' is used for?
- React js - How to mock Context when testing component
- React Context API not working from custom NPM component library
- Passing a function with React Context API to child component nested deep in the tree
- useNavigate() may be used only in the context of a <Router> component
- Update React Context using a REST Api call in a functional component
- Can a React portal be used in a Stateless Functional Component (SFC)?
- React TypeScript component with two different prop interfaces
- react context vs redux vs hooks, which one should consider and how each one is different
- React JS: Find out if component is inside a context provider
- How to create a generic React component with a typed context provider?
- React smooth transition between different states in a component
- How to use React Context with useState hook to share state from different components?
- How to create a privately shared component library which can be used across multiple react projects
- Access React context outside of component
- How to share React context state across separately mounted component trees
- How to reuse the React JS component in React Native
More Query from same tag
- npm related tasks are throwing errors during installations
- Is there a way to bold a word within a Material-UI Typography element within a Card without a shift on render?
- Xcode builds are relying on metro bundler
- Package that is linked with npm link doesn't update
- Spy on redux dispatch method
- How does a react action have access to dispatch?
- My socket io is working but when I add new data, it's not real time, ReactJS, Express, Mongoose
- Query nested objects firebase
- How to get value datapicker in react toobox custom?
- Webpack and babel-loader not resolving `ts` and `tsx` modules
- How to serve the same static files regardless of the route?
- Pass data through levels - open Modal dialog at the end
- Passing a function including parameter value to child component
- react-redux not updating state when the API returns an empty array []
- Print State of React-Redux Application in Developer Tools
- Creating react pages with unique urls
- Get file(word, excel, ppt) metadata information in nodejs
- ReactJS- can't read JSON array
- Disable button onClick in React but only to one element in Index
- ESLint reports no-undef error on flow-typed global types
- No Link to source-code in Chrome Devtools for React components
- How to create selects and states dynamically on react using Material UI?
- Modularizing code in React/Redux
- Resetting state on component in React
- Using flow with react-native
- Reactjs : TypeError: Cannot read property 'map' of undefined
- React setState with callback in functional components
- Dispatching an action from an asynch call in Redux
- What is parent-child coupling in react and how does it relate to context?
- TypeError: cannot read property setState of undefined