在 NextJS 中不使用 props 或 context 將腳本標簽添加到 React 組件

Question

我想將一個庫作為腳本標簽添加到我的 React 組件中。 我目前通過在 _app.tsx 文件中調用 API 然后訪問 _document.tsx 文件中的值來執行此操作。 在 _document.tsx 中，我通過將腳本標簽傳遞給自定義組件來將其添加到文檔頭部。

我的最終目標是從 NEXT_DATA 中刪除它（我正在開發 SSR Next JS 應用程序）。

有任何想法嗎？ 我已經研究過使用 window，但在那里沒有成功。

注意：更新了 clairty 的問題。

Answer 1

您可以在應用程序的任何位置使用 Next.js Head標簽來實現加載腳本。

例如：

    import Head from 'next/head';
    
    function MyLibraryLoader() {
        return (
            <Head>
                <script src="..." type="text/javascript" />
            </Head>
        )
    }

可以在此處找到有關 Head 標簽的更多信息： https://nextjs.org/docs/api-reference/next/head

在 NextJS 中不使用 props 或 context 將腳本標簽添加到 React 組件

問題描述

1 個解決方案

解決方案1
0 2021-06-05 20:30:34

在 NextJS 中不使用 props 或 context 將腳本標簽添加到 React 組件

問題描述

1 個解決方案

解決方案1 0 2021-06-05 20:30:34

解決方案1
0 2021-06-05 20:30:34