Как я могу использовать свой плагин jquery в Next.js? - PullRequest
Новая
       57

Как я могу использовать свой плагин jquery в Next.js?

1 голос
/ 19 сентября 2019

Я занимаюсь разработкой веб-приложения, используя Next.js, и я хотел бы использовать jQuery в Next.js.Но я не могу импортировать плагин jquery.пожалуйста, проверьте мой код и помогите мне. 


import React from 'react';
import Document, { Head, Main, NextScript } from 'next/document';
import { ServerStyleSheet } from 'styled-components';

export default class MyDocument extends Document {
  static getInitialProps({ renderPage }) {
    const sheet = new ServerStyleSheet();
    const page = renderPage(App => props => sheet.collectStyles(<App {...props} />));
    const styleTags = sheet.getStyleElement();
    return { ...page, styleTags };
  }

  render() {
    return (
      <html lang="en">
        <Head>{this.props.styleTags}
          <link
            href="//cdnjs.cloudflare.com/ajax/libs/KaTeX/0.9.0/katex.min.css"
            rel="stylesheet"
          />
         <script src="../static/js/jquery.main.js" async/>
        </Head>
        <body>
          <Main />
          <div id="modal" />
          <NextScript />
        </body>
      </html>
    );
  }
}

1 Ответ

0 голосов
/ 20 сентября 2019

Одна типичная проблема, с которой вы столкнетесь, если будете делать jQuery, заключается в следующем: после импорта плагинов jQuery они будут регистрироваться для событий onClick, и к тому времени вы не сможете гарантировать, что фактический элемент DOM готов, элементы могут быть созданы позже.и может освежиться.

Одним из способов решения проблем является вызов кода jQuery, который выполняет инициализацию в componentDidMount(), а также в componentDidUpdate(), чтобы вы могли убедиться, что элементы DOM присутствуют до того, как плагин jQuery зарегистрирует их.

...