时间戳

首页 > 解决方案 > Jquery 脚本在 nextjs 应用程序中无法正常工作

reactjs - Jquery 脚本在 nextjs 应用程序中无法正常工作

问题描述

我在我的应用程序中使用外部 CSS/Jquery UI 工具包。我在 _document.js 中添加了脚本

render() {
return (
  <Html>
    <Head />
    <body>
      <Main />
      <NextScript />
      <script src="/js/jquery-3.5.1.js"></script>
      <script src="/js/bulkit/extensions/bulma-steps.min.js"></script>
      <script src="/js/bulkit/functions.js"></script>
      <script src="/js/bulkit/main.js"></script>
    </body>
  </Html>
)}

在我的一个组件中，CSS 类没有正确初始化。

 render () { auth.user && <RegistrationForm /> }

此处组件RegistrationForm使用外部 CSS 库，并且auth.user以异步方式设置（它检查 google firebase 中的身份验证并相应地呈现组件）如果我删除auth.user，那么类将正确初始化，我可以得到想要的效果。

此处添加jquery脚本中的init函数 -
$(document).ready(function($){ init_css_class }

我尝试将其更改为$(window).on('load', function (){})。它仍然无法正常工作。我不清楚我在这里做错了什么

标签： reactjsnext.jsasync.js

解决方案

推荐阅读