vue整合百度的富文本编辑器
材料：
vue2.0
vue-ueditor-wrap
密码：ocd3
把下载的压缩包解压 放到你的vue项目的static 里面 并且在里面创建文件夹UEditor
在你需要富文本编辑器的页面引入VueUeditorWrap组件importVueUeditorWrapfrom'vue-ueditor-wrap'
注册组件：components:{
VueUeditorWrap
}
页面中挂载：data(){
return{
msg:'
Vue+UEditor+v-model双向绑定
',myConfig:{
//编辑器不自动被内容撑高
autoHeightEnabled:false,
//初始容器高度
initialFrameHeight:240,
//初始容器宽度
initialFrameWidth:'100%',
//上传文件接口(这个地址是我为了方便各位体验文件上传功能搭建的临时接口，请勿在生产环境使用！！！)
//UEditor资源文件的存放路径，如果你使用的是vue-cli生成的项目，通常不需要设置该选项，vue-ueditor-wrap会自动处理常见的情况，如果需要特殊配置，参考下方的常见问题2
UEDITOR_HOME_URL:'/static/UEditor/'
}
}
}
这样你就可以在页面中看到你加载出来的富文本编辑器了
当然富文本编辑器里面少不了上传图片这个功能，如何正常的使用这个功能我们应该怎么配置
步骤如下：
1、复制文件到你网站的更目录
把这个文件复制到你的网站更目录
2、修改文件
1、 打开你复制的文件夹找到文件controller.php
2、在你的文件有如下代码：header('Access-Control-Allow-Origin:http://localhost:8080');//设置允许跨域访问
header('Access-Control-Allow-Headers:X-Requested-With,X_Requested_With');//设置允许的跨域header
请把前面的注释去掉 并且修改成：Access-Control-Allow-Origin:http://localhost:8080'
默认的是:Access-Control-Allow-Origin:'
修改完成后保存
3、打开文件Uploader.class.php 这个文件
打开并且找到如下代码：publicfunctiongetFileInfo()
{
returnarray(
"state"=>$this->stateInfo,
"url"=>$this->fullName,
"title"=>$this->fileName,
"original"=>$this->oriName,
"type"=>$this->fileType,
"size"=>$this->fileSize
);
}
修改成如下代码：
publicfunctiongetFileInfo()
{
returnarray(
"state"=>$this->stateInfo,
"url"=>"/".$this->fullName,
"title"=>$this->fileName,
"original"=>$this->oriName,
"type"=>$this->fileType,
"size"=>$this->fileSize
);
}
这边的域名为你的网站域名
服务器上的修改完成接下来修改我们的前端的代码
在static/UEditor里面找到ueditor.config.js然后找到
//服务器统一请求接口路径
,serverUrl:URL+"php/controller.php"
修改成你现在网站上面的路径例如serverUrl:"/Upload/controller.php"
