react-quill - ReactQuill 默认字体（无衬线、衬线和等宽）不起作用

Question

我有这个反应组件，我尝试更改文本的字体，但没有效果。

这是我的组件：

<ReactQuill
  theme="snow"
  value={value}
  onChange={onChange}
  modules={QuillEditorControlled.modules}
  //   formats={QuillEditorControlled.formats}
/>

这是我的模块 JSON：

{
  toolbar: [
    // [{ header: [1, 2, 3, 4, 5, 6, false] }],
    [{ font: [] }], // fonts
    [{ size: ["8px", "10px", "12px", "14px", "16px", "18px", "20px", "24px"] }], // custom dropdown
    ["bold", "italic", "underline", "strike", "clean"], // toggled buttons
    [
      { list: "ordered" },
      { list: "bullet" },
      { indent: "-1" }, // outdent
      { indent: "+1" }, // indent
      { align: [] }, // text alignment
    ],

    [
      //   { direction: "rtl" }, // text direction
      { script: "super" }, // superscript
      { script: "sub" }, //subscript
    ],
    [
      { color: [] }, // font color
      { background: [] }, // font background color
    ],
    ["link", "image"],
  ],
}

这是组件的外观：