背景

我个人使用过***React***，Vue***和***Angular。很多时候我需要创建应用程序，并在其中从选择性数据生成图表。我最近试用了***Qwik***，因为它承诺速度很快，并尝试使用***ChartJs***在其中创建图表。但是，当***ChartJs***有单独的库可用于***React、Vue、Angular、Svelte***等。它没有用于***Qwik***的库，这是可以理解的。

问题

很多插件，比如***Highcharts***和***ChartJs***，经常需要一个DOM元素被发送到它的函数，以确定在哪里呈现它们的输出。但是当我们处理虚拟DOM时，我不能运行JS选择器脚本来获取DOM元素并将它们传递到组件内的函数。因此，到目前为止，我无法在我的***Qwik***项目中使用***ChartJs***。
尝试次数
我只是寻找这个问题的解决方案，没有找到任何可行的方法。下面的代码来自***ChartJs***docs，是他们实现图表的原始JS方式：

new Chart(
    document.getElementById('acquisitions'),
    {
      type: 'bar',
      data: {
        labels: data.map(row => row.year),
        datasets: [
          {
            label: 'Acquisitions by year',
            data: data.map(row => row.count)
          }
        ]
      }
    }
  );

正如预期的那样，document.getElementById在组件内部不起作用，这就是我遇到的问题。我只创建了useMount$()函数，我希望在其中放置生成图表的逻辑，并通过使用引用等方式四处寻找***React***解决方案。但是，除此之外，我无法找到更多的东西。
我知道查看***ChartJs***的***React***库的源代码可以为我提供线索，但当我调查一个库时（我发现以我目前的水平很难），我希望从Stack Overflow社区获得解决方案的指针。
在Qwik文档中搜索“ref”不会返回任何搜索结果，但我在网上找到了另一个开发者的git项目，并试图复制他的方法中引用的使用：
子组件代码：

import { component$, useMount$, Ref, useStylesScoped$ } from "@builder.io/qwik";
import { Chart } from 'chart.js/auto';

interface GraphProps {
  data: object[];
  reference: Ref<Element>;
}

export default component$((props: GraphProps) => {
  useStylesScoped$(styles);

  useMount$(() => {
    new Chart(
      props.reference.value,
      {
        <... options here ...>
      }
    );
  });

  return (
    <div id="chartContent">
    </div>
  );
});

父组件代码：

import { component$, useRef } from "@builder.io/qwik";
import ContentCard from "../components/contentCard/contentCard";
import ChartJSGraph from "../components/chartJSGraph/chartJSGraph";
...

export default component$(() => {
  const leftChartContainer = useRef();

  return (
    <div>
        <div className="row">
            <ContentCard>
                <div className="graph-container">
                    <ChartJSGraph
                        data={[
                        { year: 2010, count: 10 },
                        ...
                        ]}
                        reference={leftChartContainer}
                    />
                </div>
            </ContentCard>
        </div>
    </div>
  )
});

由于这些只是从YouTuber的代码中发现的，可能已经过时了，所以肯定不一定是可靠的来源。但到目前为止，搜索官方文件并没有让我找到任何官方的参考方法。