Home > Back-end >  How to execute vanilla js class in react useEffect hook
How to execute vanilla js class in react useEffect hook

Time:07-31

I am trying to use a vanilla js library in react. since there is a lot of code, I wondered how to split it. Currently, I'm storing the code for each function in separate files... but I'm not sure how to import and run it. Is there a way to run this code in the useEffect hook or will I have to convert these old classes to es6?

editor.js

EditorUi = function (editor, container, lightbox) {
  this.destroyFunctions = [];
  this.editor = editor || new Editor();
  this.container = container || document.body;
};

EditorUi.compactUi = true;
EditorUi.prototype.splitSize = 8;

MyComp.jsx

import React from 'react';
import EditorUi from '~/config/functions/bpm/EditorUi';

export default function MyComp() {
  const divGraph = React.useRef(null);

  React.useEffect(() => {
    // ...?
  });

  return <div style={{ width: '100%', height: '80vh' }} ref={divGraph} />;
}

CodePudding user response:

You've to export a function from the editor js file, then you can use it in useEffect in your component

  • Related