Question

我有一个react组件，其中包含带有setState和回调的方法。我需要将其重写为钩子。请告诉我如何重写此方法？

 beforeSubmitModal = action => (args) => {
    this.setState({
      visible: false,
      selectedMenuItem: null,
      companyCodeModal: {}
    }, () => action(args));
  };

const onDeleteCode = (id) => {
    dispatch(actions.deleteCode.request({ codeId: id }));
  };

const modalProps = {
    onSaveOrUpdate: beforeSubmitModal(dispatch(actions.insertOrEditCode.request())),
    onDelete: beforeSubmitModal(onDeleteCode),
  };

Answer 1

您将需要使用useEffect来完成

const [visible,setVisible] = useState(ture);

const doSomething = () => {
  setVisible(false);
}

useEffect(() => {
   //this will render every time the visible state changes
}, [visible]);

Answer 2

定义挂钩中的状态

const [visible,setVisible]=useState(false) // initial value false
const [selectedMenuItem,setCompanyCodeModal]=useState(null) // initial value null
const [companyCodeModal,setCompanyCodeModal]=useState('')

当他们改变时您需要采取一些行动

useEffect(()=> doSomething() ,[visible,selectedMenuItem,companyCodeModal])

我该如何用钩子重写setState和callback的react-method？

2 个答案: