vue集成百度UEditor富⽂本编辑器
在前端开发的项⽬中。难免会遇到需要在页⾯上集成⼀个富⽂本编辑器。那么。如果你有这个需求。希望可以帮助到你
vue是前端开发者所追捧的框架,简单易上⼿,但是基于vue的富⽂本编辑器⼤多数太过于精简。于是我将百度富⽂本编辑器放到vue项⽬中使⽤。效果图如下
jsp用什么前端框架废话不多说。
html
<template>
<div class="hello">
<div id="editor" type="text/plain" ></div>
<button @click="submits">保存</button>
<button @click="xieru">写⼊</button>
</div>
</template>
js
<script>
import '../../static/fig'
import '../../static/utf8-jsp/ueditor.all';
import '../../static/utf8-jsp/lang/zh-cn/zh-cn';
export default {
name: 'hello',
data () {
return {
ue: '',
uedata: [],
xierudata: []
}
},
mounted() {
this.ue = UE.getEditor('editor',{
BaseUrl: '',
UEDITOR_HOME_URL: 'static/utf8-jsp/',
// toolbars:[]
});
},
methods: {
submits(){
this.uedata.Editor('editor').getContent()); console.log(this.uedata.join("\n"));
},
xieru(){
}
}
</script>
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论