Saturday, 28 May 2022

react-rte giving TypeError: r.getEditorState is not a function in next js

I have a nextjs project and it has a react-rte component the react-rte component is displayed correctly but when I go to some other component and click back in the browsers back button I get the following error:

Unhandled Runtime Error TypeError: r.getEditorState is not a function

When I comment out the react-rte componnet the error no longer occurs

react-rte component

import React, { useState, useEffect } from "react";
import dynamic from "next/dynamic";
import PropTypes from "prop-types";
//import the component
const RichTextEditor = dynamic(() => import("react-rte"), { ssr: false });

const MyStatefulEditor = ({ onChange }) => {
  const [value, setValue] = useState([]);
  console.log(value.toString("html"));

  useEffect(() => {
    const importModule = async () => {
      //import module on the client-side to get `createEmptyValue` instead of a component
      const module = await import("react-rte");
      console.log(module);
      setValue(module.createEmptyValue());
    };
    importModule();
  }, []);

  const handleOnChange = (value) => {
    setValue(value);
    if (onChange) {
      onChange(value.toString("html"));
    }
  };

  return <RichTextEditor value={value} onChange={handleOnChange} />;
};

MyStatefulEditor.propTypes = {
  onChange: PropTypes.func,
};

export default MyStatefulEditor;


from react-rte giving TypeError: r.getEditorState is not a function in next js

No comments:

Post a Comment