javascript - 在TinyMCE中输入该行时出错

我将TyniMCE用于我的react-app。我这样配置MCE init：

import { Editor } from '@tinymce/tinymce-react';
....
 <Editor
          init={
            selector: 'textarea',
            height: 500,
            menubar: false,
            plugins: [
              'advlist autolink lists link image charmap print preview anchor',
              'searchreplace visualblocks code fullscreen',
              'insertdatetime media table paste code help wordcount'
            ],
            toolbar: 'undo redo | formatselect | bold italic backcolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | removeformat | help'
          }
          disabled={disabled}
          name={name}
          value={value}
          onChange={this.handleEditorChange}
        />

这是我的显示：



但是当我按下回车按钮进入新行。但它在上方但不下方添加了1行。像这样



我想要1> 2> 3> 4>5。但是结果是5> 4> 3> 2> 1。

请帮助我，如何解决？

对不起，我的英语能力很弱

最佳答案

您正在使用受控组件，因此需要用onEditorChange替换onChange道具，它将解决此问题。
注意
您将在onEditorChange而不是事件对象中获取值。
这是一个例子

    import React from 'react';
    import { Editor } from '@tinymce/tinymce-react';

const Tinymce = ({
    value,
    onChange,
    height = 350,
    id = 'tinymce',
    menubar = false,
}) => {

const handleEditorChange = (value) => {
    onChange && onChange(value)
}

return (
    <Editor
        id={id}
        value={value}
        init={{
            height,
            menubar,
            plugins: [
                'advtable advlist autolink lists link image charmap print preview anchor',
                'searchreplace visualblocks code fullscreen visualchars',
                'insertdatetime media table paste code help wordcount directionality emoticons'
            ],
            toolbar:
                'undo redo | formatselect | bold italic backcolor link | \
         alignleft aligncenter alignright alignjustify | \
         bullist numlist | outdent indent| table media code anchor emoticons directionality visualchars | preview | removeformat | help'
        }}
        onEditorChange={handleEditorChange}
        />
    );
}

export default Tinymce;

关于javascript - 在TinyMCE中输入该行时出错，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/58405448/