tinyMCE onBlur无法正常工作

时间:2018-07-30 16:17:10

标签: reactjs redux tinymce redux-form

我有一个tinyMCE编辑器,该编辑器正在redux表单中使用。在编辑器上方,用户可以选择要填写的字段,而2个捕获文本的字段共享相同的名称。如果用户在它们之间切换,那么我会重置字段,以使一个字段中的字符串不会显示在另一个字段中,我的问题是tinyMCE编辑器无法清除其文本,因此用户可以导航回编辑器字段,相信它们仍然有文字输入,然后点击提交。我可以输入验证,但是仍然为用户提供了完整的编辑器,也没有解释为什么某些内容为空。

我对此的解决方案是,如果用户模糊了该编辑器,并且用户选择了其他字段输入类型,则清除该编辑器。但是,编辑器没有触发onBlur事件,我也不知道为什么。

                 <Editor
                    {...field}
                    init={{
                        plugins: this.props.plugins,
                        toolbar: this.props.toolbar,
                        images_upload_handler: function (blobInfo, success, failure) {
                            let upload_type = blobInfo.blob().type;
                            let extension = blobInfo.filename().split('.').pop();
                            axios.post(`/content/create-url/${extension}`,{upload_type})
                                .then(presigned_url=>{
                                    axios.put(presigned_url.data.result.presigned_url, blobInfo.blob(),{
                                        headers:{
                                            'Content-Type':upload_type
                                        }
                                    })
                                        .then(()=>{
                                            success(presigned_url.data.result.new_url);
                                        })
                                })
                                .catch(e=>console.log(e));
                        }
                    }}
                    onChange={(event) =>{
                        field.input.onChange(field.input.value = event.target.getContent())}
                    }
                    onBlur={(event)=>field.input.onBlur(()=>{
                        if(this.props.clear_tinyMCE_content) event.target.setContent('')
                    })}

                />

0 个答案:

没有答案