当前位置: 首页 > news >正文

vue2+ueditor集成秀米编辑器

一、百度富文本编辑器

1.首先下载 百度富文本编辑器

   下载地址:GitHub - fex-team/ueditor: rich text 富文本编辑器

2.把下载好的文件整理好  放在图片目录下

3. 安装插件vue-ueditor-wrap

npm install vue-ueditor-wrap

4.在你所需要展示的页面 引入vue-ueditor-wrap

此时 ,你的页面就能展示出来编辑器了

二、集成秀米编辑器

1.你可以参考官方文档秀米图文排版UEditor插件示例,也可以参考我下面的操作

2.首先 在官方文档下载以下4个文件

            

3.把他们按照下图 丢进你的项目里

4.在main.js中引入基本文件(第一次npm run start时,编辑ueditor.all.js可能会比较慢,等待一会就好了)

注意:1.xiumi-ue-dialog-v5一定要放在ueditor.all.js后面,不然可能会出现报错

          2.下载的图标样式最好放在本地(图二),我的项目就遇到直接请求背景图地址https://dl.xiumi.us/connect/ue/xiumi-connect-icon.png(图一) 编辑器并不能展示图标的情况

        3. 在ueditor.config.js文件中 找到toolbars属性,添加dialog字段,否则编辑器也是不会展示图标的

5.此时你的编辑器就能出现秀米的图标啦

6.改写xiumi-ue-dialog-v5.js中的iframeUrl

iframeUrl: editor.ui.UEDITOR_HOME_URL + 'dialogs/xiumi-ue-dialog-v5.html',

此时点击图标,就能打开秀米编辑器了

http://www.lryc.cn/news/432032.html

相关文章:

  • [网络]HTTP协议 Cookie与Session
  • 安宝特科技 | AR眼镜在安保与安防领域的创新应用及前景
  • 2024 第十二届重庆国际植保双交会暨新型肥料农药产业博览会
  • 用“说”智能控制灯具开关语音识别芯片NRK3603
  • APS开源源码解读: 排程工具 optaplanner
  • AMEYA360:村田量产用于汽车市场的高可靠性0603M铜电极负温度系数NTC热敏电阻
  • 代码随想录第十天|150.逆波兰表达式求值 239.滑动窗口的最大值 347.前K个高频元素
  • [阅读笔记]《解读基金—我的投资观与实践》— 季凯帆
  • 2.3之前
  • 处理器基础知识——cache
  • 操作系统的运行环境
  • 如何在 Selenium 中获取网络调用请求?
  • IP学习——oneday
  • 2024 年高教社杯全国大学生数学建模竞赛 C 题 农作物的种植策略(详细思路+matlab代码+python代码+论文范例)
  • 软件工程知识点总结(1):软件工程概述
  • 热烈庆祝中国科学技术大学建校六六周年
  • iptables持久化命令:netfilter-persistent save
  • elementUI table 给表头添加气泡显示(鼠标悬浮显示注释)
  • Web3社交新经济,与 SOEX 实现无缝交易的高级安全性
  • Python和MATLAB(Java)及Arduino和Raspberry Pi(树莓派)点扩展函数导图
  • 使用isolation: isolate声明隔离混合模式
  • 93. UE5 GAS RPG 应用负面效果表现
  • TCP 和 UDP 区别
  • 免费2024柜台租赁经营合同范本模板下载分享
  • 模型和算力看板:Compute DashBoard
  • Python加载 TorchScript 格式的 ResNet18 模型分类该模型进行预测并输出预测的类别和置信度
  • 学习笔记--MybatisPlus
  • 【机器学习】XGBoost的用法和参数解释
  • Vivado 约束
  • 如何在Excel中创建一个VBA宏,并设置一个按钮来执行这个宏