Cannot read emailEditorRef.current.editor

This issue has been tracked since 2022-06-08.

editor is not defined using the default setup, calling exportHtml()
I am using nextjs12 on localhost and did wait until the editor was ready.
CustomTool and CustomCss are working.

import { useRef, useState, useEffect } from "react";
import dynamic from "next/dynamic";

const EmailEditor = dynamic(() => import("react-email-editor"), {
  ssr: false,
});

export default function EmailBuilder() {
  const emailEditorRef = useRef(null);

  function exportHtml() {
    console.log( emailEditorRef.current); // -> {retry: ƒ}
    emailEditorRef.current.editor.exportHtml((data) => {
      const { design, html } = data;
      console.log("exportHtml", html);
    });
  }

  function onLoad() {
    // editor instance is created
    // you can load your template here;
    // const templateJson = {};
    // emailEditorRef.current.editor.loadDesign(templateJson);
  }

  return (
    <div className="h-screen">
       <button className="w-24 bg-violet-dark" onClick={exportHtml}>
           save
        </button

      <EmailEditor
        id="editor-container"
        displayMode="email"
        projectId={82044}
        ref={emailEditorRef}
        onLoad={onLoad}
        minHeight="95%"
        options={{
          customCSS: [
            `
                .tab-pane {
                  background-color: white;
                }
                .nav-tabs {
                  background-color: #6E43E0;
                }
                .nav-link.active {
                  background-color: #AA89FF !important;
                }
                .nav-name, .nav-icon {
                  color: white;
                }
              `,
          ],
          customJS: [
            window.location.protocol +
              "//" +
              window.location.host +
              "/product-recommendations.js",
          ],
        }}
      />
    </div>
  );
}
evobz wrote this answer on 2022-07-07

@ari-motors-team what was the solution?

More Details About Repo
Owner Name unlayer
Repo Name react-email-editor
Full Name unlayer/react-email-editor
Language JavaScript
Created Date 2017-10-01
Updated Date 2022-12-05
Star Count 3598
Watcher Count 48
Fork Count 627
Issue Count 163

YOU MAY BE INTERESTED

Issue Title Created Date Updated Date