Skip to content

Tag: react-functional-component

On an onClick event in a React function component, should I pass a function by reference or make an anonymous function?

I found this question but it doesn’t answer my specific case, because the answers are old, don’t answer all my questions in this post and in that case they only pass the event variable to the function, but in my case I might want to pass a different type of value, like a string: React performance: anonymous function vs named

Getting undefined props in functional react components

How to pass the {requests} prop to the RequestRow component after executing the setRequests? My understanding is that the requests get initialized as undefined in the beginning and before being set with the asynchronously called object, it gets passed to the RequestRow component as undefined, and the error occurs. The RequestRow component is shown below. It takes in the {requests}

replace this.function.bind(this) for function component

I have a class component that looks like this: I want to modify it into a functional component. However, I am unable to figure out how to accurately modify this part: onClick={this.addCoord.bind(this)} because currently if I use onClick={props.addCoord()}, I would get errors like these upon using it: TypeError: Cannot read property ‘x’ of undefined Answer Change your onClick from this

TypeScript React.FC confusion

I am learning TypeScript and some bits are confusing to me. One bit is below: For both functional components above, I see TypeScript generates the same JS code. The PrintName2 component seems more streamlined to me as far as readability. I wonder what’s the difference between the two definitions and if anyone is using second type of React component? Answer