时间戳

首页 > 解决方案 > 按钮 onclick 在 reactJS 中不起作用，代码如下

reactjs - 按钮 onclick 在 reactJS 中不起作用，代码如下

问题描述

const [open, setIsOpen] = useState(false);
  const openForm = () => setIsOpen(true);
    <button class="openButton"  onClick={() => {openForm}} style={openButton}>Chat</button>        
        <div class="chatPopup" id="myForm"  style={chatPopup}>
        <Form open={open}/>
          <div class="formContainer" style={formContainer}>
            <span class="title1" style={title1}>Chat</span>
            <label for="msg"><b>Message</b></label>                                         
           <iframe customFrameSection  style={customFrameSection} frameborder="1" id="AIChat" style={{border:'1px solid rgba(0,255,0,0.3)',width: "285px",height: "400px"}}></iframe>
           <button type="button" class="btn cancel" onclick={closeForm} style={cancelButton}>Close</button>
          </div>
          </div>

我已经尝试了多种方法，点击应该打开聊天窗口，如何打开带有 id myform 的聊天弹出窗口，缺少在任何地方提供 myform id，请指点我，这里做错了什么。

标签： reactjsformsreact-hooksbuttonclick

解决方案

您正在向 onClick 侦听器提供匿名函数，它什么都不做，要么在那里调用 clickForm 函数，要么在 onClick 中传递它的引用，比如 -

const [open, setIsOpen] = useState(false);
const openForm = () => setIsOpen(true);
<button class="openButton"  onClick={openForm} style={openButton}>Chat</button>

推荐阅读