标签: react-quilljs

react-quilljs 和 reactjs-popup 不能一起工作

我正在使用 react-quilljs 和 reactjs-popup 并且无法让基于 quill 的编辑器显示在我的模式对话框中。我可以在主页上使用编辑器而没有问题,但它在弹出窗口中不起作用。

我有预期的进口:

import React from "react";
import Popup from "reactjs-popup";
import "reactjs-popup/dist/index.css";
import { useQuill } from "react-quilljs";
Run Code Online (Sandbox Code Playgroud)

我的组件看起来像这样:

const NewIdeaDialog = ({ showNewIdea }) => {
  const { quill, quillRef } = useQuill();
  return (
    <Popup open={showNewIdea} nested>
      <div>
        <form action="" method="">
          <label for="IdeaDetails">Details</label>
          <div style={{ width: 500, height: 300 }} id="IdeaDetails">
            <div ref={quillRef} />
          </div>
        </form>
      </div>
    </Popup>
  );
}
Run Code Online (Sandbox Code Playgroud)

当我设置showNewIdeatrue父组件显示弹出,符合市场预期,但鹅毛笔编辑器完全丢失。它呈现了#IdeaDetails div一个孩子,就是<div></div>这样。孩子div是完全空的,没有造型。 …

reactjs quill reactjs-popup react-quilljs

6
推荐指数
1
解决办法
94
查看次数

标签 统计

quill ×1

react-quilljs ×1

reactjs ×1

reactjs-popup ×1