基于百度富文本编辑器封装的vue 组件
链接 https://github.com/haochuan9421/vue-ueditor-wrap
- 下载依赖
# vue-ueditor-wrap v2 仅支持 Vue 2
npm i vue-ueditor-wrap@2.x
# 或者
yarn add vue-ueditor-wrap@2.x
- 引入VueUeditorWrap组件
import VueUeditorWrap from 'vue-ueditor-wrap'; // ES6 Module
// 或者
const VueUeditorWrap = require('vue-ueditor-wrap'); // CommonJS
- 注册组件
components: {
VueUeditorWrap;
}
// 或者在 main.js 里将它注册为全局组件
Vue.component('vue-ueditor-wrap', VueUeditorWrap);
- 绑定数据
<vue-ueditor-wrap v-model="msg"></vue-ueditor-wrap>
data () {
return {
msg: '<h2>Hello World!</h2>'
}
}
- 配置项
data() {
return {
msg: "<h2>Hello World!</h2>",
editorConfig: {
// 访问 UEditor 静态资源的根路径,可参考 https://hc199421.gitee.io/vue-ueditor-wrap/#/faq
UEDITOR_HOME_URL: "/UEditor/",
// 服务端接口(这个地址是我为了方便各位体验文件上传功能搭建的临时接口,请勿在生产环境使用!!!)
serverUrl: "//ueditor.szcloudplus.com/cos",
},
};
},