增加`width`属性,可以设置编辑器的宽度
This commit is contained in:
parent
d8dbf92b47
commit
bf97764daf
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div :class="{fullscreen:fullscreen}" class="tinymce-container editor-container">
|
<div :class="{fullscreen:fullscreen}" class="tinymce-container editor-container" :style="containerStyle">
|
||||||
<textarea :id="tinymceId" class="tinymce-textarea" />
|
<textarea :id="tinymceId" class="tinymce-textarea" />
|
||||||
<div class="editor-custom-btn-container">
|
<div class="editor-custom-btn-container">
|
||||||
<editorImage color="#1890ff" class="editor-upload-btn" @successCBK="imageSuccessCBK" />
|
<editorImage color="#1890ff" class="editor-upload-btn" @successCBK="imageSuccessCBK" />
|
||||||
|
@ -41,6 +41,11 @@ export default {
|
||||||
type: Number,
|
type: Number,
|
||||||
required: false,
|
required: false,
|
||||||
default: 360
|
default: 360
|
||||||
|
},
|
||||||
|
width: {
|
||||||
|
type: [Number, String],
|
||||||
|
required: false,
|
||||||
|
default: ''
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
|
@ -58,6 +63,19 @@ export default {
|
||||||
computed: {
|
computed: {
|
||||||
language() {
|
language() {
|
||||||
return this.languageTypeList[this.$store.getters.language]
|
return this.languageTypeList[this.$store.getters.language]
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* Computes style for `div.editor-container`
|
||||||
|
* @return {Object}
|
||||||
|
*/
|
||||||
|
containerStyle() {
|
||||||
|
const style = {}
|
||||||
|
if (/^[\d]+(\.\d+)?$/.test(this.width)) { // Matches `100`, `'100'`
|
||||||
|
style.width = `${this.width}px`
|
||||||
|
} else if (/^[\d]+(\.\d+)?([a-z]{2}|%)$/.test(this.width)) { // Matches `100px`, `100rem`, `70%`, etc
|
||||||
|
style.width = `${this.width}`
|
||||||
|
}
|
||||||
|
return style
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
|
|
Loading…
Reference in New Issue