Início / coding / Perguntas / 77752586
Accepted
Dolev Dublon
Asked: 2024-01-03 22:30:13 +0800 CST

Demonstração da linha de varredura ReactJS: problema com múltiplas superfícies que não são atualizadas simultaneamente

  • 772

Preciso fazer uma demonstração de uma linha de varredura com múltiplas superfícies com reactjs, mas o problema é que quando opto por mostrar mais de 1 superfície ela apenas reproduz os dados da última superfície criada e para de desenhar dados nas superfícies antigas.

você pode ver o exemplo aqui com o código: https://28zf6p.csb.app/

este é um GIF para o problema: insira a descrição da imagem aqui

observação: o motivo pelo qual preciso de várias superfícies é que quero que os gráficos possam ser arrastados com sortableJS para seguir o design que obtive.

javascript

1 respostas

  1. Best Answer

    Não fui fundo, parece que há um erro nas funções que geram gráficos e o link para a div é lembrado.

    Porém, se você adicionar o atributo id ao div, ele começará a funcionar como deveria. Talvez a própria biblioteca, nos bastidores, use o id para acessar o elemento DOM.

    em App.js

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

    em SciChart.jsx

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

    teste aqui https://codesandbox.io

    • 3

relate perguntas