如何调用带有或不带有换行箭头函数的两个函数

Question

import{useState } from 'react'
export const useForm=(callback, initialState={})=>{

const [values, setvalues] = useState(initialState)
const onChange=(event)=>{
setvalues({...values,[event.target.name]:event.target.value})
}
const onSubmit=  event =>{
callback();
}
return{
onChange,
onSubmit,
values
}
}
function createPostCallback(){
createPost();
}
const [open, setOpen] =useState(false)

return (
<Modal 
as={Form}
onSubmit={onSubmit} 

• 这很好，但当我将其更改为{onSubmit&&setOpen(false(}时，它表示渲染过多，所以我包装了一个箭头函数，如下所示｛((=>｛onsubmit((&&setOpen(false(｝｝，但只有onsubmit函数有效，如果我将其更改为｛((=>｛setOpen(false(&&onSubmit((｝｝setOpen作品。。我在这里干什么？怎么解决这个问题

  open={true}
  dimmer={'blurring'}
  onClose={() => setOpen(false)}
  onOpen={() => setOpen(true)}
  open={open}
  trigger={<i  class="circular add icon" ></i>}
  >
  <div>
  
  <Image size='medium' src='/images/avatar/large/rachel.png' wrapped />
  <TextArea
  rows={2}
  placeholder="whats on ur mind..?"
  name="body"
  onChange={onChange}
  value={values.body}
  >
  </TextArea><Modal.Actions>
  <Button  type="submit" color="instagram">post</Button>
  </Modal.Actions>
  </div>    
  </Modal>
  )
  

  }

Answer 1

对于干净的代码，我建议您执行另一个同时调用这两个函数的函数：

function onSubmitAndSetOpenFalse() {
onSubmit();
setOpen(false);
}
...
onSubmit={onSubmitAndSetOpenFalse} 

或者你可以像Shri Hari告诉的那样

onSubmit={() => {  onSubmit(); setOpen(false);  }} 

两者都会起作用。

Answer 2

我认为您只需要调用不带&&运算符的函数。

onSubmit={() => {  onSubmit(); setOpen(false);  }} 

希望能奏效！