sming-payments
v1.3.5
Published
리액트 페이먼츠
Downloads
16
Readme
Install
npm i sming-paymentsUsage
Setting
// index.jsx
import { SmingModalProvider } from "sming-payments";
const root = ReactDOM.createRoot(document.getElementById("root"));
root.render(
<SmingModalProvider>
<App />
</SmingModalProvider>
);<!-- public/index.html-->
<!DOCTYPE html>
<html lang="ko">
<!--... -->
<body>
<div id="root"></div>
<div id="sming-modal"></div>
</body>
</html>SmingPayment Component
import { SmingPayment, useSmingPayment } from "sming-payments";
function App() {
const { isShowModal, toggleModal } = useSmingPayment();
const onClickPayButton = () => {
// 결제시에 발생할 로직
};
return (
<SmingPayment
price={34000}
isShowModal={isShowModal}
toggleModal={toggleModal}
payButtonHandler={onClickPayButton}
/>
);
}render SmingPayment
// payment.jsx
const { isShowModal, toggleModal } = useSmingPayment();
const onClickPaymentButton = () => {
toggleModal();
};
const onClickPayButton = () => {
// 결제시에 발생할 로직
};
return (
<>
<SmingPayment
price={34000}
isShowModal={isShowModal}
toggleModal={toggleModal}
payButtonHandler={onClickPayButton}
/>
<button onClick={onClickPaymentButton}>buy</button>
</>
);- must add price, isShowModal, toggleModal attributes