66 lines
1.3 KiB
Vue
66 lines
1.3 KiB
Vue
<template>
|
|
<div ref="cover"></div>
|
|
</template>
|
|
|
|
<script>
|
|
import E from 'wangeditor'
|
|
var phoneEditor, _this
|
|
export default {
|
|
components: {},
|
|
props: {
|
|
coverVal: {
|
|
type: String,
|
|
required: false
|
|
}
|
|
},
|
|
data () {
|
|
return {}
|
|
},
|
|
created () {},
|
|
mounted () {
|
|
_this = this
|
|
phoneEditor = new E(this.$refs.cover)
|
|
phoneEditor.customConfig.onchange = html => {
|
|
_this.$emit('cover', html)
|
|
}
|
|
phoneEditor.customConfig.menus = [
|
|
'head', // 标题
|
|
'bold', // 粗体
|
|
'fontSize', // 字号
|
|
'fontName', // 字体
|
|
'italic', // 斜体
|
|
'underline', // 下划线
|
|
'strikeThrough', // 删除线
|
|
'foreColor', // 文字颜色
|
|
'backColor', // 背景颜色
|
|
// 'link', // 插入链接
|
|
// 'list', // 列表
|
|
'justify', // 对齐方式
|
|
// 'quote', // 引用
|
|
// 'emoticon', // 表情
|
|
// 'image', // 插入图片
|
|
'table', // 表格
|
|
// 'video', // 插入视频
|
|
// 'code', // 插入代码
|
|
'undo', // 撤销
|
|
'redo' // 重复
|
|
]
|
|
phoneEditor.create()
|
|
},
|
|
methods: {},
|
|
computed: {},
|
|
watch: {
|
|
coverVal (val) {
|
|
phoneEditor.txt.html(val)
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
#cover {
|
|
width: 100%;
|
|
height: 250px;
|
|
}
|
|
</style>
|