我在 razorpay 集成中收到 tagName of null 错误。此错误与主管有关。
github 存储库链接 https://github.com/rajatgalav/razorpay-demo
我试着调试它。如果我从 index.js 文件中删除 head 组件，则不会出现问题。但我也想在我的项目中使用 head 组件。
<Head>
<title>Create Next App</title>
<link rel="icon" href="/favicon.ico" />
</Head>
<main className={styles.main}>
<button onClick={displayRazorpay}>pay</button>
</main>
head是从NextJs的next/head包中导入的
最佳答案
Nextjs 添加默认视口(viewport)元标记 <meta name="viewport" content="width=device-width"> .
但是 razorpay 脚本删除了视口(viewport)元标记并添加了它自己的版本。 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
并且还添加了主题颜色元标记 <meta name="theme-color" content="#ff7400"> .
Nextjs 无法检测到这些更改并尝试更新 header 。这就是您在转到成功页面时看到此错误的原因。
所以我通过 window.location = '/success' 将用户重定向到成功页面而不是使用 router.push('/success')
我还在研究如何在使用路由器时避免错误。
关于reactjs - 无法读取 nextJs 中 razorpay 付款的 null 属性 'tagName'，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/65963922/