vue2js项目集成百度UEditor 路径问题
最近公司的一个vue2的项目需要用到百度UEditor富文本编辑器。在集成进来的过程中遇到点路径问题,资源目录没法访问,项目目录截图
模板和资源文件目录
//组件百度编辑器
<template>
<div ref="editor"></div>
</template>
<script>
/* eslint-disable */
import '../../assets/ueditor/ueditor.config';
import '../../assets/ueditor/ueditor.all';
import '../../assets/ueditor/lang/zh-cn/zh-cn';
export default {
name:"ueditor",
data() {
return {
id: Math.random().toString(16).substring(2) + 'ueditorId',
};
},
props: {
value: {
type: String,
default: null,
},
config: {
type: Object,
default: {},
}
},
watch: {
value: function value(val, oldVal) {
this.editor = UE.getEditor(this.id, this.config);
if (val !== null) {
this.editor.setContent(val);
}
},
},
mounted() {
this.$nextTick(function f1() {
// 保证 this.$el 已经插入文档
this.$refs.editor.id = this.id;
this.editor = UE.getEditor(this.id, this.config);
this.editor.ready(function f2() {
this.editor.setContent(this.value);
this.editor.addListener("contentChange", function () {
const wordCount = this.editor.getContentLength(true);
const content = this.editor.getContent();
const plainTxt = this.editor.getPlainTxt();
this.$emit('input', { wordCount: wordCount, content: content, plainTxt: plainTxt });
}.bind(this));
this.$emit('ready', this.editor);
}.bind(this));
});
},
};
</script>
<style>
body{
background-color:#ff0000;
}
</style>
//注册全局组件名称
//引用组件
//结果就报错了
本地的资源目录 全部无法访问,我也修改了配置文件
请问下vue的大神们有用过这个么 有遇到过相似问题么?希望大神们 指点下 感激不尽
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(10)
应该还是你路径问题吧 他是从项目根目录开始 我是放在static下的
去掉appAdmin 然后下面就是引进对应其他静态资源 应该就好办了
我在github上搜到这样一个vue组件,不知对你有没有用。https://github.com/yiwuyu/vue-ueditor
你好,你这个解决了吗?我也碰到这个问题了。
最近也碰到了这个问题,在路径上面尝试了各种方式的写法,都还是报这个错误。难道时集成方式不对?现在很怀疑这个
我老铁你的问题解决了么,我也遇到这个东西,看了好多资料各种办法都想过了
我也出现这个问题,最后是发现webpack配置出错。有同样问题的同学,可以改一下webpack的配置。
ueditor.config.js文件路径改一下,var URL = window.UEDITOR_HOME_URL || "/static/xxx/";
被二次打包,放static下
我因为遇到这个坑 请问博主解决了吗
请问最后是如何解决这个路径引用问题的,目前也是遇到这个问题,感觉比较头痛,弄了好久没有结果!