score:0
after a large amount of experimentation, this what i ended up with. it appears to work correctly:
class basecomponent<props:object, state, defaultprops: $shape<props>> extends react.component<defaultprops, props, state> {
static defaultprops: $abstract<defaultprops>;
props: props;
state: $abstract<state>;
}
the key was to define props/state/and defaultprops on basecomponent
in addition to passing the type params through to react.components
. i'm not sure why this is necessary, but it does solve the issue.
score:0
in order to have my code work with a variable number of generic arguments, this is how i ended up typing the component:
export default class newcomponent<p, s = {}> extends component<p, s> {
props: p
state: s
...
}
score:2
this works for me:
class basecomponent<d, p, s> extends react.component<d, p, s> {
static defaultprops: d
props: p
state: s
yourcustomfunction(): void
}
class you extends basecomponent<any, any, any> {
--- component body ---
}
Source: stackoverflow.com
Related Query
- How do Inherit from custom React Component without losing flow type information?
- How to type a styled component without losing any prop with Typescript?
- How to to copy Flow type of properties from another React component?
- How to write to apollo cache from within React component with out losing context of "this"
- How to type a custom React select component using TypeScript?
- How to pass function from FUNCTIONAL to CLASS component and access it outside of render( without prop ), using context in react js?
- How to define an interface for React function component with defaultProps without throwing missing type error?
- How to expose a 'generic' event from a custom React component in TypeScript v2.x
- How can I wrap a material-ui react component to a Web Component without losing the styles?
- How do you prevent a re-created React component from losing state?
- How to declare the module type of an react component for flowtype, without breaking the formatter?
- React hook form how to pass value from custom component to controller with already assign own on change?
- how to access a custom react component function from its parent component?
- how to display information by props from an array of objects in a component in React JS
- How can I combine onBlur and onFocus in my React Component without reselecting the text on every letter I type in?
- How do I use a custom DOM node to render to from within a react component
- How to properly export a component from a React custom hook and a function to control it?
- How to return custom component from another function in react JS?
- How to set the state of a component with the information obtained from a promise to avoid memory leaks in react
- React JS: How to call a validation method of a custom Input component from its Parent
- 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 can I transfer an information from child component to parent component React.js with React Router
- How to I apply a custom style for a third-party component in a single React component without affecting its style in other components?
- How to set event type in custom child component from parent component?
- How do I display information from node.js in HTML or React preferably without express?
- React Native - How to pass the Image from the other Component without using React Redux
- How can I prevent my functional component from re-rendering with React memo or React hooks?
- Making an HTML string from a React component in background, how to use the string by dangerouslySetInnerHTML in another React component
- How to prevent child component from re-rendering when using React hooks and memo?
- TypeScript conditional types: Extract component props type from react component
More Query from same tag
- React localStorage object properties returning undefined
- ReactJS mapped choices array based on id
- In react, how do I access state inside an action creator?
- How to execute a function after loading a component in Reactjs + MobX?
- Referencing local variable without `this` in function component
- Running a useEffect once with happy ESLint
- How to export multiple varying 3d scenes with GLTFExporter in react-three-fiber
- React: When passing in a function to one instance of a component, why are all other instances effected?
- React-select How to clear options once user selected
- onClick not working on my React component
- Material-UI - why different css is shown on prod environment then development env
- Re-render React Component when query string changes
- How to create a 360 panorama image in Gatsby/React?
- Reactjs Retrieving values from custom components
- React lazy import from cdn
- justify center antd form
- reactjs : Diffrence between regular/arrow functions and react functional components
- Disable scrolling on `<input type=number>` in React
- 'Undefined' when attempting to pass MaterialUI theme props to styled components
- how to use Date range filter in reactjs
- undefined errors object in react-hook-form
- How to BLINK a <DIV> according to database data (json)
- Simple approach to check and store which states that has changed from initial value
- react redux / react thunks api
- Files upload testing in Enzyme
- React calendar not rendering styles
- There is an error on the return ( and I cannot understand why
- How to get code completion for typed react component properties?
- How to make Protected routes from an object of routes?
- How to fetch data from Web API using React query?