如何在React中动态加载脚本

import("path/to/script.js").then(() => {
  // 脚本加载成功后的操作
}).catch((error) => {
  // 脚本加载失败时的错误处理
});

import React, { useEffect } from 'react';

function MyComponent() {
  useEffect(() => {
    import("path/to/script.js").then(() => {
      // 脚本加载成功后的操作
    }).catch((error) => {
      // 脚本加载失败时的错误处理
    });
  }, []); // 空依赖数组确保只在组件加载完成时执行一次

  return (
    // 组件内容
  );
}

export default MyComponent;

import React, { useEffect, useState } from 'react';

function MyComponent() {
  const [shouldLoadScript, setShouldLoadScript] = useState(false);

  useEffect(() => {
    if (shouldLoadScript) {
      import("path/to/script.js").then(() => {
        // 脚本加载成功后的操作
      }).catch((error) => {
        // 脚本加载失败时的错误处理
      });
    }
  }, [shouldLoadScript]);

  return (
    <button onClick={() => setShouldLoadScript(true)}>加载脚本</button>
  );
}

export default MyComponent;