Question

我在页面底部创建了一个按钮，单击该按钮可以打开模式。现在我在标题中有一个按钮。我希望当我们单击该标题按钮时，它也应该打开模态。这就是我们如何使用页面底部按钮所使用的相同功能。

Answer 1

按钮单击应设置状态。国家决定是否显示模态

使用挂钩执行此操作的一种方法是使按钮的状态设置为布尔值，该布尔值决定是否显示模式。

const Component = () => {

  const [modalOpen,setModalOpen] = useState(false)

  return (
    <div>
      <button onClick={setModalOpen(true)} >
        Open Modal 1
      </button>
      <div>
        Your other content
      </div>
      <button onClick={setModalOpen(true)} >
        Open Modal 2
      </button>
      <Modal show={modalOpen} />
    </div>
  )
}

对不同的按钮使用相同的功能

1 个答案: