我正在尝试围绕tinymce-vue
包创建包装。但是,v模型的内容似乎总是比编辑器的实际内容落后一个字符。
我也尝试使用onKeyUp
事件,但是例如当用户使用工具栏上的按钮添加粗体字时,这种情况会丢失。
<tinymce :id="'create_discussion_content'" v-model="form.content"></tinymce>
<template>
<editor :init="init" :plugins="plugins" :toolbar="toolbar" :id="id" :initial-value="value" @onSelectionChange="updateContent()" v-model="content"></editor>
</template>
<script>
export default {
props: ['id', 'value'],
mounted()
{
this.content = this.value;
},
data()
{
return {
content: null,
init:
{
height: 200,
menubar: false,
statusbar: false,
},
plugins: 'hr, image, link, lists, textcolor',
toolbar: [
'undo redo | removeformat forecolor | bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | link image',
],
}
},
methods:
{
updateContent()
{
this.$emit('input', this.content);
}
}
}
</script>