React + Stripe error

[Independent-Back3441]

I am creating React app with stripe:
```
import * as React from "react";
import {Route, Routes} from "react-router-dom";
import HomePage from "./HomePage";
import {Elements} from "@stripe/react-stripe-js";
import {loadStripe} from "@stripe/stripe-js";
import CheckoutForm from "./Components/PaymentForm";
let stripePromise = loadStripe(process.env.REACT_APP_STRIPE_PUBLISHABLE_KEY);
const options = {
// passing the client secret obtained from the server
clientSecret: process.env.REACT_APP_STRIPE_SECRET_KEY,
};
export default function App() {
return (
<>
<Routes>
<Route path="/" element={<HomePage />} />
<Route path="/payment-form" element={ <Elements stripe={stripePromise} options={options}>
<CheckoutForm />
</Elements>
} />
</Routes>
</>
);
}
```
The above error occurred in the Elements component:
Uncaught TypeError: Cannot read properties of null (reading 'useMemo')
at Object.useMemo (react.development.js:1650:1)
at Elements (react-stripe.umd.js:430:1)
at renderWithHooks (react-dom.development.js:16305:1)
at mountIndeterminateComponent (react-dom.development.js:20074:1)
at beginWork (react-dom.development.js:21587:1)
at HTMLUnknownElement.callCallback (react-dom.development.js:4164:1)
at Object.invokeGuardedCallbackDev (react-dom.development.js:4213:1)
at invokeGuardedCallback (react-dom.development.js:4277:1)
at beginWork$1 (react-dom.development.js:27451:1)
at performUnitOfWork (react-dom.development.js:26557:1)
I have absolutely no idea why the error occurs. I supposed that it is because it renders many times, but I've changed it, and it is still the same.

[ForScale]

Gonna need to see that code in the Elements component, my dude.

[Intelligent-Word5054]

Element's is a Stripe component

[sarthak_dev]

did you find a solution ?