I am in the process of trying to implement different functions in a reusable button component.

I'm working in this code sandbox https://codesandbox.io/s/elated-keller-3xnyk6?file=/src/App.js

I would like the functionality in the last two buttons in the first two buttons

would appreciate any help. thanks

CodePudding user response：

Try something like this:

<div className="App">
  <h1>
    {message}
    {count}
  </h1>

  <Button
    text="like ❤️"
    handleClick={function () {
      count >=0 && setMessage("like ❤️");
      increase();
    }}
  />

  <Button
    text="unlike