Использование ссылок на некомпонентный файл JS

Question

У меня есть вспомогательная функция в JS некомпонентном файле, который я хочу экспортировать и использовать в своих компонентах. В этой функции я в настоящее время использую findDOMNode для нацеливания на переданный ему объект d3graph, но это дает предупреждение о том, что функция findDOMNode устарела. Не могли бы вы помочь мне реорганизовать это, чтобы использовать ссылки?

См. Код ниже:

tick = (that) => {
    that.d3Graph = d3.select(ReactDOM.findDOMNode(that));
    nsp.force.on('tick', () => {
      that.d3Graph.call(updateGraph)
    });
  };

Answer 1

Вам необходимо передать ссылку вспомогательной функции:

const tick = (ref) => {
  ref.current.d3Graph = d3.select(ref.current);
  nsp.force.on("tick", () => {
    ref.current.d3Graph.call(() => console.log("called"));
  });
};

Получение ссылки возможно с помощью useRef (функциональный компонент) или createRef (classComponent)

const graphRef = useRef();

useEffect(() => {
  tick(graphRef.current);
}, [])

<D3Component ref={graphRef}/>