国内企业网站模板,网站优化 流量,企业网络方案设计,4s店网站建设1、安装 npm add vue-ueditor-wrap 或者 pnpm add vue-ueditor-wrap 进行安装 2、下载UEditor
官网#xff1a;ueditor:rich text 富文本编辑器 - GitCode
整理好的#xff1a;vue-ueditor: 百度编辑器JSP版
因为官方的我没用来#xff0c;所以我自己找的另外的包 …1、安装 npm add vue-ueditor-wrap 或者 pnpm add vue-ueditor-wrap 进行安装 2、下载UEditor
官网ueditor:rich text 富文本编辑器 - GitCode
整理好的vue-ueditor: 百度编辑器JSP版
因为官方的我没用来所以我自己找的另外的包
3、把下载好的包放在项目目录下 /public下 4、main.js配置
// main.js
import { createApp } from vue;
import VueUeditorWrap from vue-ueditor-wrap;
import App from ./App.vue;createApp(App).use(VueUeditorWrap).mount(#app); 5、v-model 数据绑定
vue-ueditor-wrap v-modelmsg :configeditorConfig editor-ideditor-demo-01 /
import { reactive } from vue;
const msg ref();
const editorConfig reactive({// 编辑器不自动被内容撑高autoHeightEnabled: false,// 初始容器高度initialFrameHeight: 400,// 初始容器宽度initialFrameWidth: 100%,UEDITOR_HOME_URL: /UEditor/, // 访问 UEditor 静态资源的根路径可参考常见问题1serverUrl: /pc/pc/Fileimg/uderto, // 服务端接⼝uploadUrl: /pc/pc/Fileimg/uderto /kjyl-server-doctor/doctor/file/uploadFile,// enableAutoSave: true, // 开启从草稿箱恢复功能需要⼿动设置固定的 editorId否则组件会默认随机⼀个如果页⾯刷新下次渲染的时候 editorId 会重新随机// 服务端接口这个地址是我为了方便各位体验文件上传功能搭建的临时接口请勿在生产环境使用
}); 6、上传图片报错说什么未配置 在修改为自己的接口即可使用