1

我正在使用react-quill，它的要求是modules道具必须被缓存并且不应该改变。我正在使用useMemo钩子来记忆它。对象是：

const modules = useMemo(() => ({
  key: {
    value: {
      handler: handlerFunc
    }
  }), [])

它的用法如下：

<Quill
  modules={modules}
  value={value}
  onChange={onChange}
  // value and onChange are props
/>

handleFunc在modules对象中，只是控制台日志value道具。问题是这value不是最新的，它是第一个值。我在类组件中尝试了同样的事情，我能够获得价值并且它工作得非常好，但不幸的是它不适用于useMemo. 请注意，我不能只输入as不应该更改[value]的第二个参数。useMemomodules

类组件实现：

class MyComponent extends React.Component {
  constructor() {
    super()
    this.handlerFunc = this.handlerFunc.bind(this)
    this.modules = this.initModules(this.handlerFunc)
  }

  initModules(handlerFunc) {
    return {
      key: {
        value: {
          handler: handlerFunc,
        },
      },
    }
  }

  handlerFunc() {
    console.log(this.props.value)
  }
}

但我不能使用类组件，因为它是只使用功能组件的要求。有什么办法，我可以有最新value的useMemo，或者任何其他的解决方案？

4

1 回答 1

1

为什么您不将 a 分配ref给编辑器并从中获取值，而不是从valueprop 中获取？

const editor = this.reactQuillRef.getEditor();
editor.getText(); // getText, getHTML or whatever

这是链接

于 2022-03-03T10:15:51.603 回答