Menu
I want to call a function inside some embedded html. I tried the following but the function isn't called. Would this be the incorrect way of calling a function inside a render method?
import React, { Component, PropTypes } from 'react'; export default class PatientTable extends Component { constructor(props) { super(props); this.state = { checking:false }; this.renderIcon = this.renderIcon.bind(this); } renderIcon(){ console.log("came here") return( <div>Function called</div> ) } render() { return ( <div className="patient-container"> {this.renderIcon} </div> ); } } 
266
In this article, we will learn how to call a function to render in ReactJS. React is having 2 types of components, i.e, Class based and Functional Components, but render method is only in Class based components. So we will make a class based component and call a function in that.
In React, the onClick handler allows you to call a function and perform an action when an element is clicked. onClick is the cornerstone of any React app. Click on any of the examples below to see code snippets and common uses: Call a Function After Clicking a Button.
The render() takes care of the DOM elements and is invoked every time the component is mounted or updated. Thus ,any JavaScript that needs to be executed after the render method has completed can go inside two methods: ComponentDidMount() in the mounting phase and ComponentDidUpdate() in the updating phase.
To call the function you have to add ()
{this.renderIcon()} If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
