情景:表格旁点击编辑显示一个弹框,弹框里富文本显示表格相对应内容
问题:当富文本作为一个弹框里部分显示,:value="ueditor.value"赋值的时候,弹框隐藏后(点击取消按钮)再次点击弹框显示时,富文本内容为空,但是控制台里可以打印出内容
<div class="text-css">
<el-form-item label="内容编辑" prop="content">
<Uediter :value="ueditor.value" :config="ueditor.config" ref="ue"></Uediter>
</el-form-item>
</div>
<el-button @click="dialogFormVisible = false">取 消</el-button>
ueditor: {
value: '',
config: {
initialFrameWidth: 790,
initialFrameHeight: 320
}
},
handleUpdate(index, row) {
this.type = '编辑';
this.dialogFormVisible = true;//弹框显示
console.log(row.content);//这里打印内容正常
this.ueditor = {
value: row.content,
};
},
这里是引入的ueditor
<template>
<div>
<script id="editor" type="text/plain"></script>
</div>
</template>
<script>
export default {
name: 'ue',
data () {
return {
editor: null
}
},
props: {
value: '',
config: {}
},
mounted () {
// ready
this.editor = window.UE.getEditor('editor', this.config);
this.editor.addListener('ready', () => {
this.editor.setContent(this.value)
})
UE.Editor.prototype._bkGetActionUrl = UE.Editor.prototype.getActionUrl;
UE.Editor.prototype.getActionUrl = function(action) {
if (action == 'uploadimage' || action == 'uploadfile') {
return window.location.protocol+"//"+window.location.hostname+":"+window.location.port+'/healthback/uploadController/UEditorUpload';
} else if (action == 'uploadvideo') {
return 'http://a.b.com/video.php';
} else {
return this._bkGetActionUrl.call(this, action);
}
}
},
methods: {
getUEContent () {
return this.editor.getContent()
},
getUEtxt(){
return this.editor.getContentTxt()
},
setUEContent(cont){
return this.editor.setContent(cont);
},
setDisabled(){// 设置不可编辑
return this.editor.setDisabled();
},
setEnabled(){// 设置可编辑
return this.editor.setEnabled();
},
},
destroyed () {
this.editor.destroy()
}
}
</script>