如何在 reactJS 的请求中从 CKEditor 传递 <p> 标签？

Question

onFocus(evt) {
   console.log(evt);
    console.log("htmltag <p> ", evt.editor._.data);
    this.activeEditor = evt.editor;

}

onChange(evt){

  var newContent = evt.editor.getData();
  this.setState({content: newContent});
  console.log("CKEditor content",newContent);

}

我正在处理 CKEditor 的 onChange 事件。在编辑器的焦点上，我在编辑器中输入了一些数据。从 onFocus() 我能够获得 "evt.editor._.data" 的控制台，例如 this is xyz in paragraph tag

现在我需要使用以下请求调用 API：

_createTemplateDetails(e){
    e.preventDefault();

    let data = {
      name : this.state.name,
      title : this.state.title,
      orgName : this.state.orgName,
      formName: this.state.formName,
      html:  '<html><head></head><body></body></html>'
     };

    TemplateAction._createTemplateDetails(data);

 }

在 body 标签之间，我需要从 onFocus(evt) 传递安慰段落标签，我可以从 "evt.editor._.data"

Answer 1

您似乎正在将在编辑器区域中键入的内容存储在组件状态内，在属性内容下：this.state.content

因此，当您提出请求时，只需将其包含在您的 html 属性数据对象中即可：

const data = {
  // ...
  html: `<html><head></head><body>${this.state.content}</body></html>`,
};

上面的构造使用了字符串插值。如果你没有 ES6 到 ES5 转译，只需像这样使用连接：

'<html><head></head><body>' + this.state.content + '</body></html>'

如何在 reactJS 的请求中从 CKEditor 传递 <p> 标签？

How to pass <p> tag from CKEditor in the request in reactJS?

javascript

ckeditor

reactjs