想要在 div 中添加 data-* 属性，第三方 JS lib React Next Js 将使用该属性
Want to add data-* attribute in a div which will be used by third party JS lib React Next Js
const speed :string =`{"speed": 0.2}`
<div className="section jarallax h-100vh" data-jarallax={speed}
style={{backgroundImage: "url('/images/header-bg.jpg')"}}
id="home">
</div>
<Script src="./js/parallax.js" strategy="beforeInteractive" />
它抛出一个错误：Hydration failed because the initial UI does not match what was rendered on the server.
抛出错误是因为受 server-side 渲染影响的组件与 UI 的其余组件不匹配。您可以尝试删除脚本标记中的 beforeactive 属性。
如果这没有帮助，请访问此 link：
https://nextjs.org/docs/messages/react-hydration-error
const speed :string =`{"speed": 0.2}`
<div className="section jarallax h-100vh" data-jarallax={speed}
style={{backgroundImage: "url('/images/header-bg.jpg')"}}
id="home">
</div>
<Script src="./js/parallax.js" strategy="beforeInteractive" />
它抛出一个错误：Hydration failed because the initial UI does not match what was rendered on the server.
抛出错误是因为受 server-side 渲染影响的组件与 UI 的其余组件不匹配。您可以尝试删除脚本标记中的 beforeactive 属性。
如果这没有帮助，请访问此 link： https://nextjs.org/docs/messages/react-hydration-error