jquery - 将 virtualsky 库嵌入到 react 组件中

Question

我想创建将嵌入Virtualsky的反应组件库

我已经浏览过react doc，很多 stackoverflow 主题，尝试使用 react-helmet 库，但我无法编写任何看起来可以工作的东西。

谁能给我一些很好的例子或建议来引导我。谢谢。

编辑：

import $ from 'jquery';
import 'https://slowe.github.io/VirtualSky/stuquery.min.js'
import 'https://slowe.github.io/VirtualSky/virtualsky.min.js'
import React, { useEffect } from "react";

const VirtualSky = props => {
  const id = "test";
  const width = "500px";
  const height = "500px";

  useEffect(() => {
    const planetarium = $.virtualsky({ id });
  }, []);

  return (
    <div id={id} style={{ width, height }} />
  );
};

export default VirtualSky;

无论我做什么，总是得到“virtualsky”不是一个功能。

Answer 1

只需在useEffect钩子中调用 jQuery 插件即可。

像这样的东西：

const VisualSky = ({  id, width, height }) => {
  React.useEffect(() => {
    const planetarium = $.virtualsky({ id });
  }, []);
  return (
    <div id={id} style={{ width, height }} />
  );
};

const App = () => (
  <VisualSky id="startmap" width={500} heigh={500} />
);