vue中如何使用ueditor富文本编辑器

这篇文章主要介绍vue中如何使用ueditor富文本编辑器,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!

创新互联建站专注于企业营销型网站建设、网站重做改版、船营网站定制设计、自适应品牌网站建设、HTML5建站商城开发、集团公司官网建设、外贸网站建设、高端网站制作、响应式网页设计等建站业务,价格优惠性价比高,为船营等各大城市提供网站开发制作服务。

Vue的优点

Vue具体轻量级框架、简单易学、双向数据绑定、组件化、数据和结构的分离、虚拟DOM、运行速度快等优势,Vue中页面使用的是局部刷新,不用每次跳转页面都要请求所有数据和dom,可以大大提升访问速度和用户体验。

最近在做后台管理系统的时候遇到要使用富文本编辑器。最后选择了ueditor,我的项目使用 vue+vuex+vue-router+webpack+elementUI的方案完成框架的搭建,

 1、下载UEditor官网最新的jsp版本的包,下载完成解压之后得到一个utf8-jsp的文件夹,里面包含的内容如下:

vue中如何使用ueditor富文本编辑器vue中如何使用ueditor富文本编辑器

2、将这个文件夹改名为ueditor,并且移入自己项目中的static文件夹下,修改ueditor.config.js文件夹中的内容,如下图:

vue中如何使用ueditor富文本编辑器vue中如何使用ueditor富文本编辑器

3、编写子组件



4、在父组件中使用

5、弄好之后,上传图片会提示后端配置项http错误,文件上传会提示上传错误。这里提别申明一点,ueditor在前端配置好后,需要与后端部分配合进行,然后将配置ueditor.config.js 里的serverUrl的前缀改陈你自己的后端访问的请求路径地址

serverUrl: "统一请求地址"

以上是“vue中如何使用ueditor富文本编辑器”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注创新互联行业资讯频道!


本文名称:vue中如何使用ueditor富文本编辑器
浏览地址:http://scyanting.com/article/gpssoo.html