wangEditor内容赋值

本文已参与「新人创作礼」活动， 一起开启掘金创作之路。

​

 接上文 ，vue后台文章编辑功能_兰颜的博客-CSDN博客_vue实现编辑功能

需要把已经存起来的内容在编辑器里面显示

关键代码

this.editor.txt.html(res.msg[0].content)

括号里面的值，就是存储起来的数据，根据个人的项目的字段不同，需要变化

完整代码

<el-form-item label="内容" class="block">
    <div id="addpagecontent"></div>
</el-form-item>

import E from 'wangeditor'
export default {
		data() {
			return {
				form:{},
			}
		},
		created() {
			this.selId()
		},
		methods: {
			selId(){
				//获取传递过来的id
				let id = this.id
				//根据id来查询数据
				articId(id).then(res =>{
					console.log(res.msg[0])
					this.form = res.msg[0] 
					this.editor = new E('#addpagecontent');
					this.editor.create(); //创建富文本编辑器
					this.editor.config.zIndex = 50
					this.editor.txt.html(res.msg[0].content)  //编辑器内容
				})
			},
		}
	}

效果

​编辑

​