在 React.js 的功能组件中使用 onClick 隐藏按钮

Question

通过单击按钮 我需要它隐藏按钮 所有这些都使用 React.js 中的功能组件 onClick

Demo

Answer 1

您可以使用 useState 挂钩创建本地状态，以在重新呈现之间隐藏内容，并有条件地呈现内容，如下所示：

import React, {useState} from 'react'
export default function App() {
const [hidden, setHidden] = useState(false);
  return (
     <div className="App">
      <h1>OnClick in the button show and hide</h1>
      {!hidden && <button onClick={() => setHidden(true)}>Click Me</button>}
    </div>
  );
}