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

Question

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

我的应用程序允许用户以英语或西班牙语编辑内容，将结果保存到数据库中的不同位置。当加载英文文本时，拼写检查是很棒的-但是当加载西班牙语文本时，整个内容都会被拼写检查为英语。一定有办法在飞行中改变这一点……？

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

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

Answer 1

从quilljs source可以看出，容器似乎只是一个普通的HTML引用，为了禁用拼写检查而必须设置的属性来自HTML Standard，所以我们可以推断拼写检查工作是由浏览器执行的，而不是由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}
    />
  );
};