score:0
Accepted answer
you probably have a typo in class childcomp extends parentcomp
. apart from it, you can simply access the parent function in child using this
keyword as if it is its own function.
class parentcomp extends react.component {
constructor(props) {
super(props);
}
foo() {
console.log("hello world");
}
componentdidmount() {
this.foo();
}
}
class childcomp extends parentcomp {
componentdidmount() {
this.foo();
}
render() {
return "hello codesandbox";
}
}
score:0
pass the parent method to the child as a property.
export default class parentcomp extends grandparentcomp {
constructor(props) {
super(props);
}
foo() {
console.log("hello world")
}
render() {
return (
<childcomp foo={this.foo()}
);
}
}
call it in the child component.
export default class childcomp extends parentcomp {
constructor(props){
super(props)
}
componentwillmount() {
this.props.foo();
}
}
Source: stackoverflow.com
Related Query
- React: Calling parent's method through inheritance
- A react component is not rendered even after calling it through ReactDOM.render( ) method
- Why does calling react setState method not mutate the state immediately?
- React calling a method on load only once
- Calling a method inside getDerivedStateFromProps in React
- Test React component method is calling function pass as a prop
- Calling a Android Native UI component method from React native Js code
- Calling setState() in React from render method
- How to test React state after calling a component method that updates state - using Enzyme
- React + Redux App: Calling API through a Redux action Vs Calling an API directly
- Calling Api post method on button click in React
- How do I pass a React Context's state through an onClick function created in a method inside that context class?
- React Child Calling Parent Method Can't Access State
- React different ways of calling a child method
- What is the difference between passing a function name in onclick react and calling it through callback
- React Component calling method to a different component
- browser says " request has been blocked by CORS policy" when calling to a spring boot get method from react js using axios
- React router - calling same method outside componentDidMount
- React components make inheritance through Compositon
- React useMemo with a onClick calling a method
- React life cycle methods won't fire, when calling React.Component<props,state>'s render() method
- React Component Inheritance to use parent method and child method
- Updating a hook without calling the set updater method in React
- React hook is not calling "mount" when same route is loaded, only clear method is called
- State is not Reflecting after calling HandleCheck Method in React Product List Program
- Calling React component method of redux-form
- How to send token through headers by using axios post method in react
- React Calling Parent's Method Nothing Happens
- calling a method of a particular child ref in react when there are multiple components
- React calling a function inside the render method leads to endless call stack
More Query from same tag
- How to properly configure Suspense position into Canvas?
- React + TypeScript: Uncaught TypeError: this is undefined
- (p)React avoid unnecessary rerender on submit
- How to show validation errors on form using React
- how can reactjs access session data(username) from django
- Can i link a js file with a jsx file ? react only for front (not react native)
- my mapdispatch to props is automatically calling
- how to not display an icon based on the props value using react and typescript?
- React relay injectNetworkLayer is not a function
- React component ignores dynamic element while re-rendering
- Cannot connect component inside React Route to redux store
- Custom React hook with function as arguments
- REACT - error: 'slate-react' does not contain a default export (imported as 'Editor')
- React/Redux fetching data and conditionally render a component - too many re-renders
- Adding Babel to HTML
- Adding a react component to a vanilla JS file
- React Jest: trigger 'addEventListener' 'message' from tests
- react- redux toolkit app issue when trying to get redux data into component
- Invalid hook call. Hooks can only be called inside the body of a functional component
- how to know which "child" checkbox is selected in reactjs
- Nodejs Multer On Success get The return value
- MaterialUI Button Could not override style
- how to show the contents in one ui using reactjs
- Material-table TypeError: Cannot add property tableData, object is not extensible
- How to return the data in one function call for two different object keys
- Javascript Can't read second element of array that is array
- React passing onClick value from one class to another
- Testing react-router Redirects with Jest and Enzyme
- How to type dispatch of an async thunk?
- Firebase Storage Promise Not Being Resolved