vue项目使用Ueditor富文本编辑器总结
我使用的是前端大佬封装的vue-ueditor-wrap插件,结合ueditor本身的压缩包开发的。
1.下载vue-ueditor-wrap:
npm install vue-ueditor-wrap -S
说明:下载这个插件对vue使用方便,有双向数据绑定的优势,操作相对方便点
2.下载ueditor官方提供的压缩包:
下载地址:https://ueditor.baidu.com/website/download.html
3.将下载好的官方压缩包放到static下面:

这里要说明:项目如果使用的是vue-cil2.0版本的,就放到static,若为vue-cil3.0版本的,就放到public文件夹下
4.在组件里引用ueditor并且使用:
引用:

使用组件:

ueditor的一些参数配置:

说明:1.上传文件一定要和后台商量好接口地址,要不然无法上传还会报错:

2.单张图片无法上传问题,建议使用最新版的ueditor压缩包,新版的解决了这个问题
新版的ueditor下载包:https://ueditor.baidu.com/website/onlinedemo.html
5.ueditor编辑器添加成功:

参考文章:https://blog.csdn.net/haochuan9421/article/details/81975966
https://ueditor.baidu.com/website/onlinedemo.html
vue项目使用Ueditor富文本编辑器总结的更多相关文章
- vue集成百度UEditor富文本编辑器
在前端开发的项目中.难免会遇到需要在页面上集成一个富文本编辑器.那么.如果你有这个需求.希望可以帮助到你 vue是前端开发者所追捧的框架,简单易上手,但是基于vue的富文本编辑器大多数太过于精简.于是 ...
- Vue 中使用UEditor富文本编辑器-亲测可用-vue-ueditor-wrap
其中UEditor中也存在不少错误,再引用过程中. 但是UEditor相对还是比较好用的一个富文本编辑器. vue-ueditor-wrap说明 Vue + UEditor + v-model 双向绑 ...
- ssm项目中ueditor富文本编辑器的使用
一.下载 https://ueditor.baidu.com/website/index.html 将ueditor放到项目中合适的位置 二 . 配置文件上传路径 在utf8-jsp/jsp/conf ...
- WEB项目中使用UEditor(富文本编辑器)
Ueditor富文本编辑器是在很多项目里经常用到的框架,是百度开发团队开发的一款很好用的富文本编辑器 下面就是我在一个系统里用到的,有了富文本编辑器,管理员使用起来不是很方便? 所以本博客介绍这个富文 ...
- MVC 使用 Ueditor富文本编辑器
一.Ueditor 1.下载Ueditor富文本编辑器 官方下载地址: http://ueditor.baidu.com/website/download.html 建议下载开发版,此处我下载的是 . ...
- 前后端分离ueditor富文本编辑器的使用-Java版本
最近在写一个自己的后台管理系统(主要是写着玩的,用来熟悉后端java的知识,目前只是会简单的写点接口),想在项目中编写一个发布新闻文章的功能,想到了使用百度的ueditor富文本编辑器,网上找了很多j ...
- ASP.NET MVC5 中百度ueditor富文本编辑器的使用
随着网站信息发布内容越来越多,越来越重视美观,富文本编辑就是不可缺少的了,众多编辑器比较后我选了百度的ueditor富文本编辑器. 百度ueditor富文本编辑器分为两种一种是完全版的ueditor, ...
- PHP如何搭建百度Ueditor富文本编辑器
本文为大家分享了PHP搭建百度Ueditor富文本编辑器的方法,供大家参考,具体内容如下 下载UEditor 官网:下载地址 将下载好的文件解压到thinkphp项目中,本文是解压到PUBLIC目录下 ...
- UEditor富文本编辑器简单使用
UEditor富文本编辑器简单使用 一.下载地址:https://ueditor.baidu.com/website/ 官网中并没有 python 版本的 UEditor 富文本编辑器,本文简单介绍 ...
随机推荐
- 在wcharczuk/go-chart图表上打印文字
先看效果: 源码 package main import ( "bytes" "fmt" "io/ioutil" & ...
- Android高可用移动网络连接---(转载自http://wingjay.com/2019/01/16/mobile-network-connection/)
读者好,前面我们在 <Android 架构之网络连接与加速> 和<Android 架构之长连接技术>两篇文章中,讲解了 Http 短连接.TCP 长连接.连接复用与速度优化.数 ...
- 基础面试,为什么面试官总喜欢问String?
关于 Java String,这是面试的基础,但是还有很多童鞋不能说清楚,所以本文将简单而又透彻的说明一下那个让你迷惑的 String 在 Java 中,我们有两种方式创建一个字符串 String x ...
- du 配合sort查看文件夹大小
du -s * | sort -nr | head 选出排在前面的10个 du -s * | sort -nr | tail 选出排在后面的10个
- Object(Asp.NET核心机制内置对象汇总)
ASP.NET有个大佬,HttpContext(在.Net Core中依然是它)Http请求的上下文,任何一个环节都是需要HttpContext的,需要的参数信息,处理的中间结果,最终的结果,都是放在 ...
- 关于ScriptManager.RegisterStartupScript 摘录
//ScriptManager.RegisterStartupScript 方法 (Control, Type, String, String, Boolean) public static void ...
- 关于.Net Core 部署在Linux下连接SqlServer数据库超时解决办法
.Net Core 在 Linux 下连接 SqlServer 需要 SqlServer2008 SP3或以上版本,或SqlServer2012,或SqlServer2014. 如果SqlServer ...
- SpringBoot 教程之属性加载详解
免费Java高级资料需要自己领取,涵盖了Java.Redis.MongoDB.MySQL.Zookeeper.Spring Cloud.Dubbo高并发分布式等教程,一共30G. ...
- 函数的防抖---js
执行规定一段时间后执行 <input type="text" id="inp" /> <script> var oInp = docum ...
- 微信小程序json与xml互相转换
1.首先在目录结构中引入必要的js文件 https://files.cnblogs.com/files/qianyou304/x2j.rar 2.js中代码如下:(部分)json 2 xml var ...