如何在 Quilljs (React) 中更改拼写检查语言

Question

如何在 React 中更改 quill.js 中拼写检查器的语言？

我的应用程序允许用户以英语或西班牙语编辑内容，将结果保存到数据库中的不同位置。加载英文文本时，拼写检查很棒 - 但加载西班牙语文本时，整个内容都被拼写为英文。必须有一种方法可以即时更改...？

This Stack Overflow answer 展示了如何完全禁用拼写检查器，但我找不到有关切换到不同语言的信息。

还请提供您找到该信息的源链接，因为我一直在搜索但没有看到它。

Answer 1

正如quilljs source 所见，容器似乎只是一个普通的 HTML DOM 引用，并且您必须设置以禁用拼写检查的属性来自 HTML 标准，因此我们可以推断出拼写检查作业已被执行由浏览器而不是 quill。

在this Stack Overflow answer's update 中声明拼写检查尊重标签的lang 属性，所以您需要做的是根据它应该使用的语言设置该属性。

为我认为可以工作的组件截取的代码

// For typings
import Quill from "react-quill";
import QuillEditor from "quill"

export const MultiLangQuill = ({ content, onChange, lang }) => {
  const ref = React.useRef<Quill & { editor: QuillEditor }>(null);

  React.useEffect(() => {
    ref.current?.editor.root.setAttribute("lang", lang);
  }, [lang]);

  return (
    <Quill
      // set the ref to access to quill editor
      ref={ref}
      theme="snow"
      value={content}
      onChange={onChange}
      modules={modules}
      formats={formats}
    />
  );
};