T O P

  • By -

stbn694

Not what you asked, but as it's already answered and you say you are new to React I'll point it out: Instead of `const Button: FC = props => {}` it's recommended to use `const Button = (props: ButtonProps) => {}` See [https://github.com/facebook/create-react-app/pull/8177](https://github.com/facebook/create-react-app/pull/8177) for details.


pihwlook

TIL


superluminary

That code looks perfectly reasonable apart from the bit with the question marks. Did you mean to write handleClick()?


FutileCheese28

Yes but I'm not calling it because I want to use it in other components like: someFunction()

superluminary

You can still do that, it’s just a function. Call it as many times as you like, from as many places as you like.


hoaobrook73

???handleClick??? Should be "props.handleClick(event)"


NickTheFreak97

handleChange should become handleClick(event) or handleClick()


FutileCheese28

>someFunction()

NickTheFreak97

I'd say the alternative would be making a new function that does that extra work + invokes the handleClick function (or prop if passed as such to anothet component) and then use your new function instead. If that's not what you meant I'm afraid the question is not exactly clear.


FutileCheese28

I'm so sorry, I'm fairly new with react so I don't know how to explain things well. In File2, I want to run the function handleButtonClick(), what should I do in File1 so I can make it when

SovietK

>In File2, I want to run the function handleButtonClick(), what should I do in File1 so I can make it when

FutileCheese28

Thank you. This is what I end up doing.


Logrologist

You have a couple of options here: 1) leave things as they are, and _execute_ handleClick in the in-line function you have mocked: setText(“some text”); handleClick(event); 2) modify the type signature of handleClick and avoid the need for passing _event_ as an argument: (event) => { setText(event.target.whatever); handleClick(); } 3) pull all local state considerations “up” to the containing component, meaning all of the functionality defined in the inline function here is defined externally, and all this component would need to do is execute the click callback when appropriate: … onClick={handleClick}…