Manually detach/destroy #87
Unanswered
eziP9AgWuixq
asked this question in
Help
Replies: 1 comment
-
You may be calling credit card methods without having completed initialisation const PaymentForm: FC = () => {
const [isMount, setIsMount] = useState<boolean>(false);
useEffect(() => {
/** Wait for 1 second for Square payment form initialisation */
const timer = setTimeout(() => setIsMount(true), 1000);
return () => {
clearTimeout(timer);
setIsMount(false);
};
}, []);
return (
<PaymentForm {...props}>
{isMount ? ( <CreditCard />) : (<></>)}
</PaymentForm >
);
};
export default PaymentForm; |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
is it possible to manually invoke the detach or destroy methods?
scenario:
the user is presented with a list of payment methods, once they select one, the rswp component renders that method along with a Back button. they click Back button to go back to the list of methods and choose the same one they selected the first time. this causes the rswp component to not render because it's already attached to the DOM.
when using the sdk straight from square, i would call a function to detach the element when the Back button was clicked. is there any way to handle this with the rswp package?
update: it seems this issue doesn't happen with Google Pay or Afterpay, but it does with Cashapp. with CreditCard, the flow mentioned above gives this error from Square:
Uncaught (in promise) PaymentMethodNotAttachedError: Card has not been attached to the page. It must be attached before you can call this method.
Beta Was this translation helpful? Give feedback.
All reactions