在VUE中使用富文本編輯器ueditor


1.搭建Vue腳手架

參考文章 鏈接

2.去ueditor官網下載ueditor

本文選擇的是1.4.3. 3 Jsp UTF-8版本

將下載好的ueditor 文件夾放入到Vue項目的static文件夾中(這里將文件夾重命名為UE了)

3.修改ueditor.config.JS文件

添加

     window.UEDITOR_HOME_URL = "/static/ue/"

注意這里的url一定要寫對,不然會出現看不到工具欄所有圖標的問題。。。

在想要使用uedit的頁面中

//html
<!--ueditor-->
     <div class="hello">
      <div id="editor" type="text/plain" style="width:100%;"></div>
     </div>

//js
import "../../static/ue/ueditor.config.js";
import "../../static/ue/ueditor.all.js";
import "../../static/ue/lang/zh-cn/zh-cn.js";
import "../../static/ue/ueditor.parse.js";
export default {
  name: "hello",
  data() {
    return {
      msg: "ueditor"
    };
  },
  mounted() {
    this.ue = UE.getEditor("editor");
  }
};

ueditor 就加載到頁面中了

關於上傳圖片顯示 “后端配置項沒有正常加載,上傳插件不能正常使用!”的問題,需要在
ueditor.config.JS 中修改 serverUrl: URL + "jsp/controller.jsp" 成后台接口路徑即可


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM