Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/reactjs/22.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/ionic-framework/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Reactjs 所有富文本编辑器都会运行onChange函数,而不会对组件进行任何更改?_Reactjs_Rich Text Editor_Quill - Fatal编程技术网

Reactjs 所有富文本编辑器都会运行onChange函数,而不会对组件进行任何更改?

Reactjs 所有富文本编辑器都会运行onChange函数,而不会对组件进行任何更改?,reactjs,rich-text-editor,quill,Reactjs,Rich Text Editor,Quill,我尝试了几个react文本编辑器,如Quill、CKEditor和其他编辑器,在我的应用程序中,它们的反应都是一样的 我有一个应用程序可以调用一个api到后端,所以我设置了状态: const [values, setValues] = useState({ user:{}, notes: '', prescription: '', }); 我进行API调用 function getInfo() {

我尝试了几个react文本编辑器,如Quill、CKEditor和其他编辑器,在我的应用程序中,它们的反应都是一样的

我有一个应用程序可以调用一个api到后端,所以我设置了状态:

   const [values, setValues] = useState({
            user:{},
            notes: '',
            prescription: '',
     });
我进行API调用

function getInfo() {
        //Traer la información de la consulta
        getdataAPI(id).then((response) => {
            if (response.data.error) {
                console.log(response.data.error);
            } else {
                console.log('FROM API TO SET ON VALUES ACT:', response.data);
                setValues({
                    ...values,
                    user: response.data.patient,
                    notes: response.data.notes,
                    prescription: response.data.prescription,
                });
            }
        });
    }
console.log上的api响应为:

{
user: {name: Mike},
notes: '<p>Line One</p><p>Line Two</p>',
prescription: '<p>Line One</p><p>Line Two</p>'
}
我使用hook useffect来限制api get:

useEffect(() => {
    getInfo();
    // eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
我将羽毛笔的两个组成部分渲染为:

return(
<Fragment>
    <ReactQuill
          theme='bubble'
          value={values.notes}
          onChange={handleQuillChange('Notes')}
    />
 <ReactQuill
          theme='bubble'
          value={values.prescription}
          onChange={handleQuillChange('Prescription')}
  />
</Fragment>
)
返回(
)
预期结果是有2个富文本编辑器,其中包含来自API的值。但其中一个总是以空白开始

调试时,我发现富文本编辑器上的组件运行
handleChange
函数时没有任何更改。。。这会将状态从API上的状态更改为初始状态,除一个富编辑器外,所有字段中都有空格

我用文本区域组件更改组件(富格文本编辑器),即使使用相同的函数和值,也能像我预期的那样工作,只需更改组件

有人可以解释为什么组件在没有任何句柄更改的情况下触发句柄更改?或者如何解决我的问题

return(
<Fragment>
    <ReactQuill
          theme='bubble'
          value={values.notes}
          onChange={handleQuillChange('Notes')}
    />
 <ReactQuill
          theme='bubble'
          value={values.prescription}
          onChange={handleQuillChange('Prescription')}
  />
</Fragment>
)