score:4
Accepted answer
you can make parentcomponent
generic as well so that the childcomponent
can specify different props and state:
interface parentprops {
something: string
}
interface parentstate {
somethingelse: string
}
export class parentcomponent<tprops extends parentprops = parentprops, tstate extends parentstate = parentstate>
extends react.component<tprops, tstate> {
// component logic.
sharedfunction() {
// some shared function.
}
}
interface childprops {
something: string
}
interface childstate {
somethingelse: string
}
export class childcomponent extends parentcomponent<childprops, childstate> {
// child component logic.
}
Source: stackoverflow.com
Related Query
- How to declare different state and props for subclasses on react with typescript
- How to specify (optional) default props with TypeScript for stateless, functional React components?
- how to type state and dispatch for useReducer - typescript and react
- router props and custom props with typescript react router dom for functional components
- how to use different IP address for development and production with react and axios
- React.render in TypeScript for component with both props and state
- How to define TypeScript types when used with React useState and the previous state inside a state updating function?
- How to setup a generic interface for the state when using React useReducer with typescript
- How to modify state in reduxjs/toolkit with React and TypeScript
- How to implement an props interface for conditions with styled components in React with Typescript
- relation between reactjs ,setState, Interface props and Interface state with respect to typescript , how can I use setState?
- How to declare a type for react thunk in typescript and reuse for component dependency?
- React & Jest, how to test changing state and checking for another component
- Typescript and React setting initial state with empty typed array
- How to set React component state and props from browser
- How to use React with Typescript and SASS
- How to correctly set initial state in React with Typescript without constructor?
- How to use React Context with useState hook to share state from different components?
- how to make webpack typescript react webpack-dev-server configuration for auto building and reloading page
- How to declare types of props of SVG component? [React, TypeScript and Webpack]
- React Typescript how send props and use it in child component
- How to use a different delay for each item with React transition group?
- Using different API url for development and production with React and axios
- ReactJS - How can I implement pagination for react with keep state when route change?
- Spread operator with React Props in Typescript (error: ...could be instantiated with a different subtype of constraint {})
- How to optimize React components with React.memo and useCallback when callbacks are changing state in the parent
- Sync queryParameters with Redux state and react router for function components
- How to TypeScript a props interface containing an object and merge with defaultProps
- How can ı pass function with state for react useContext
- how to change image src using props with styled component and react
More Query from same tag
- How to use .contains() or any other function to see if any part of a string is in an array
- How to pass parameter from child to parent using function in react with es6 syntax
- Task :app:transformNativeLibsWithMergeJniLibsForDebug FAILED
- Redux-Saga is running twice for a single action
- Cross Origin Reques blocked
- How to check that a certain prop has received?
- how to call a class from the function
- The attempt to bind "/%PUBLIC_URL%/manifest.json" in the workspace failed as this URI is malformed when running on Netlify
- GraphQL rate limit on mutations
- React doesn't render returned thing from async function
- React - State not updated or getting reset to old state
- how to create list of Years in the dropdown using react js JSX
- Selfhosted Azure DevOps Agent running as NetworkService not able to complete npm install and npm build
- How to store react component in state and pass a callback function
- React rendered components from Django doesn't show after reloading
- Conditionally add key/value pairs of two separate objects (one in array within initial state) for array method inside of useState() hook
- How to use React Component to assign value using JSX
- Add vendor prefixes for inline css in React for background Linear Gradient
- In useEffect, what's the difference between providing no dependency array and an empty one?
- React focus div after it has loaded
- .glb file import in threejs shows black object
- TypeError: this.state.PostsAtt.map is not a function - ReactJS
- Change style of header component on scroll on home page only in React.Js
- Applying class conditionally in sass/React using ternary operator
- React, Firebase - signInWithEmailAndPassword - cannot use the user variable outside .then() block
- React checkbox feature with only single selection
- Build a dropdown with an eventHandler. How to structure hooks + eventhandler
- In React JS, using react-select want to set options to default value after checkbox unchecked
- React JS maintain array inside state
- React.js Architecture for web and native mobile application?