vue + element: the use of rich text edit box

Forms Design:

<el-form-item label="内容" label-width="150px">
          <div ref="editor"  style="text-align:left;margin: 5px;width: 800px"> </div>
</el-form-item>

  

  // rich text edit box 
  Updated () { 
    var = new new Editor E (the this. $ Refs.editor) 
    editor.customConfig.uploadImgShowBase64 = // use base64 to save the image to true 
    // can not modify 
    editor.customConfig.uploadImgHeaders = this.headers 
    / / custom file name can not be modified, the changes will upload failed 
    editor.customConfig.uploadFileName = 'file' 
    editor.customConfig.uploadImgServer = this.imagesUploadApi // upload pictures to the server 
    editor.customConfig.onchange = (html) => { 
      HTML = this.form.content 
    } 
    // = the this isAdd var. route.query.isAdd $ 
    // the console.log (isAdd) 
    // initialize the edit box 
    editor.create () 
    // if the contents are edited page spread rich text box 
    editor.txt.html (this.form.content)  
    //}
  },

 At first I was created with function, but after clicking Edit, the original content inside the data is not presented in rich text box editor, and later changed to function will be created class updated function can be achieved

Cause: vue life cycle, created dom elements are not present before rendering, then mounted exists in dom element rendering, but still original form content initialization time, and updated after all the data is present in the update,

So if you want to edit the content of the page you want to spread the rich text

editor.txt.html (this.form.content) 
provided that this.form.content there is data that the use of updated function solved

 

Guess you like

Origin www.cnblogs.com/purple-windbells/p/11243606.html