提交时不会触发 ReactJs 中的函数答案

【问题标题】：On submits doesn't trigger a function in ReactJs提交时不会触发 ReactJs 中的函数
【发布时间】：2023-02-14 22:53:51
【问题描述】：

const CreateMessage = () => {
    const disatch = useDispatch()
    const chatR = useSelector(state => state.chat);
    const { chat } = chatR;
    const [text, setText] = useState("")
    useEffect(()=>{
        setText("")
    },[chat])
    
    function handleSubmit(event) {
        event.preventDefault()
        console.log(3333)
      }
    
  return (
    <StyledCreateMessage id="myform" onSubmit={handleSubmit}>
        <div className="searchForm">
            {/* <input className='input' type="text" placeholder='Write a message...' /> */}
            <textarea value={text} onChange={(e)=>setText(e.target.value)}  spellCheck="false" className='input' placeholder='write a message...'></textarea>
        </div>
        <div className="send">
        <Stack direction="row" spacing={1}>
                <IconButton  color="primary" sx={{color:"white"}} aria-label="upload picture" component="label">
                    <input hidden  type="file"  />
                    <AttachFileIcon />
                </IconButton>
                <IconButton  color="primary" sx={{color:"white"}} aria-label="upload picture" component="label">
                    <input hidden type="file" accept='image/*' />
                    <PhotoCamera />
                </IconButton>
                <IconButton type="submit" form="myform" color="primary" sx={{color:"white"}} aria-label="upload picture" component="label">
                    <SendIcon />
                </IconButton>
        </Stack>

        </div>
    </StyledCreateMessage>
  )
}

为什么我打卡的时候

<IconButton type="submit" form="myform" color="primary" sx={{color:"white"}} aria-label="upload picture" component="label">
   <SendIcon />
</IconButton>

它不会触发 handleSubmit

【问题讨论】：

标签： reactjs form-submit onsubmit

【解决方案1】：

您需要将 onClick={handleSubmit} 添加到 IconButton

【讨论】：