vue项目引入秀米插件

使用步骤

 

 效果图

 查看秀米第三方对接平台，根据步骤配置

链接地址：https://ent.xiumi.us/ue/

UEditor整个文件代码附上（在第一行，叫“npm i vue-ueditor-wrap”，下载解压即可），注：整个UEditor文件放入static文件夹下

下载UEditor

npm i vue-ueditor-wrap

页面使用

<el-form-item
      label="文章内容"
      style="width: 80%"
      label-width="100px"
      prop="content"
    >
      <vue-ueditor-wrap v-model="info.content" :config="editorConfig" class="article_wen"></vue-ueditor-wrap>
    </el-form-item>

<script>
    import VueUeditorWrap from "vue-ueditor-wrap"; // 引入vue-ueditor-wrap
export default {
  name: "ArticleInsert",
  components: {
    VueUeditorWrap, //注册组件
  },
data() {
    return {
      // ueditor配置
      editorConfig: {
        autoHeightEnabled: true, // 自动变高
        autoFloatEnabled: true,
        elementPathEnabled : false,
        initialContent: "请输入内容",
        autoClearinitialContent: true,
        initialFrameWidth: "100%", // 初始化宽
        initialFrameHeight: "30%", // 初始化高
        // BaseUrl: "/admin/",
        // 上传文件接口（这个地址是我为了方便各位体验文件上传功能搭建的临时接口） - 修改成自己后端地址
        // serverUrl: "/antifreeze-platform/library/uploadArticle",
        // UEditor 资源文件的存放路径
        UEDITOR_HOME_URL: "/admin/static/UEditor/", // 重要重要重要重要重要重要重要重要重要 必须配置好路径!!!
      },
}
}
</script>