我需要用reactjs做一个带有多个曲面的扫描线的演示,但问题是,当我 Select 显示多个曲面时,它只会在最新创建的曲面上播放数据,并停止在旧曲面上绘制数据.

您可以在这里看到代码为https://28zf6p.csb.app/的示例

this is a GIF for the problem: enter image description here

注意:我需要多个表面的原因是,我想让图表可以用sorableJS拖动,以遵循我得到的设计.

推荐答案

我没有深入研究,似乎在生成图形的函数中存在错误,并且指向div的链接被记住.

但是,如果您将id属性添加到div中,它就会开始正常工作.也许库本身在底层使用id来访问DOM元素.

在App.js中

for (let i = 0; i < value; i++) {
  sciCharts.push(<SciChart key={i} id={i} />);
}

在SciChart.jsx中

const SciChart = ({ id }) => {
...
return (
  <div id={id} ref={ref} style={{ height: "20%", width: "20%" }}>
    SciChart
  </div>
);
}

在此测试https://codesandbox.io

Javascript相关问答推荐

如何将拖放功能添加到我已自定义为图像的文件输入HTML标签中?

使用JavaScript在ionic Web应用程序中更新.pane和.view的背景 colored颜色

fs. writeFile()vs fs.writeFile()vs fs.appendFile()

Google图表时间轴—更改hAxis文本 colored颜色

Msgraph用户邀请自定义邮箱模板

分层树视图

简单的PayPal按钮集成导致404错误

我创建了一个创建对象的函数,我希望从该函数创建的对象具有唯一的键.我怎么能做到这一点?

在Matter.js中添加从点A到另一个约束的约束

根据一个条件,如何从处理过的数组中移除一项并将其移动到另一个数组?

如何在.NET Core中将chtml文件链接到Java脚本文件?

如何在我的Next.js项目中.blob()我的图像文件?

传递方法VS泛型对象VS事件特定对象

将嵌套数组的元素乘以其深度,输出一个和

判断函数参数的类型

Next.js无法从外部本地主机获取图像

有没有办法通过使用不同数组中的值进行排序

JQuery使用选项填充HTMLSELECT并设置默认结果,默认结果显示为空

如何在css中裁剪成一定Angular 的圆的一部分,而不需要复杂的多边形

如何在Java脚本中添加一个可以在另一个面板中垂直调整大小的面板?