javascript - 反应句柄函数

Question

我是 React 的新手，有点挣扎。我有两个类似的组件，我正在处理在 IOS 上打开模式时向后滚动。我已经通过这种方式解决了这个问题：

    const handleShow = () => {
    if (disabled) return;
    setShow(true);
    document.body.style.top = `-${window.scrollY}px`
    document.body.style.position = 'fixed'
  };
  
    const handleClose = () => {
    resetForm();
    setShow(false);
     
    const scrollY = document.body.style.top
     document.body.style.position = ''
     document.body.style.top = '' 
     window.scrollTo(0, parseInt(scrollY || '0') * -1)
  };
  

然后将其应用于模态作为回报。

第二个组件的编写方式不同，我真的不知道如何应用相同的功能。

const AddPaymentModal = ({ show, onHide}) => {

**some other functions**
return (
    <Modal show={show} onHide={onHide}>
       **Some other code**
      <button onClick={onHide} className="btn modal-payment-footer-btn">{t('Close')}</button>
    </Modal>

  );
};

应用这两个功能的最佳方法是什么？

谢谢