实现效果:

分析后端数据无法显示的原因

• 在何时创建wangEditor? 答:一般情况下在mounted()中创建
• wangEditor实例是否能够正常创建 答:能够正常创建，但无法加载数据
• 创建wangEditor实例时，是否能够拿到后端数据 答:能够拿到后端数据，但是仅限于在mounted()函数中，发送网络请求作用域内。在创建wangEditor作用域中无法拿到已经获取的后端数据

分析结果

• 在mounted()生命周期中，data中的数据可以进行赋值，修改，但是无法在修改data中变量的值的作用域之外的mounted()中作用域使用!否则变量中保存的值为undefined

解决问题

• 在获取后端数据的作用域中进行创建wangEditor,并且为其赋值

代码实现

创建wangEditor实例

mounted () {
    request({
     url:'/getmannotice',
          method:'post',
          data:{
           userid:this.userid
          }
        },
        res=>{
        if(res.data.code=='200')
        {
          this.getmannotice=res.data.notice;
          // wangeditor
          this.phoneEditor = new E('#EditorElem')
          // 创建一个富文本编辑器
          this.phoneEditor.create()
          // 富文本内容
          this.phoneEditor.txt.html()
          this.phoneEditor.txt.append(this.getmannotice)
        }
        else{
            this.$message.error('获取公告失败！')
        }
    },
    err=>{
        console.log(err)
        this.$message.error('获取公告失败！')
    })}

request文件(axios封装)

import axios  from "axios";
export function request(config,success,error)
{const instance=axios.create({
    baseURL: 'http://0.0.01',
    timeout:5000,
    method:'post'
})
instance(config).then(
    res=>{
        success(res)
    })
    .catch(err=>{
        error(err)
    })
}