fix:fix tinymce bug in <keep-alive>

This commit is contained in:
Pan 2017-10-31 11:06:41 +08:00
parent 1ae31fdd45
commit 2c868f47d9
1 changed files with 44 additions and 65 deletions

View File

@ -52,6 +52,16 @@ export default {
} }
}, },
mounted() { mounted() {
this.initTinymce()
},
activated() {
this.initTinymce()
},
deactivated() {
this.destroyTinymce()
},
methods: {
initTinymce() {
const _this = this const _this = this
window.tinymce.init({ window.tinymce.init({
selector: `#${this.tinymceId}`, selector: `#${this.tinymceId}`,
@ -67,7 +77,6 @@ export default {
code_dialog_width: 1000, code_dialog_width: 1000,
advlist_bullet_styles: 'square', advlist_bullet_styles: 'square',
advlist_number_styles: 'default', advlist_number_styles: 'default',
block_formats: '普通标签=p;小标题=h2;',
imagetools_cors_hosts: ['wpimg.wallstcn.com', 'wallstreetcn.com'], imagetools_cors_hosts: ['wpimg.wallstcn.com', 'wallstreetcn.com'],
imagetools_toolbar: 'watermark', imagetools_toolbar: 'watermark',
default_link_target: '_blank', default_link_target: '_blank',
@ -81,7 +90,7 @@ export default {
this.hasChange = true this.hasChange = true
this.$emit('input', editor.getContent({ format: 'raw' })) this.$emit('input', editor.getContent({ format: 'raw' }))
}) })
}, }
// //
// images_dataimg_filter(img) { // images_dataimg_filter(img) {
// setTimeout(() => { // setTimeout(() => {
@ -115,41 +124,11 @@ export default {
// console.log(err); // console.log(err);
// }); // });
// }, // },
setup(editor) {
editor.addButton('h2', {
title: '小标题', // tooltip text seen on mouseover
text: '小标题',
onclick() {
editor.execCommand('mceToggleFormat', false, 'h2')
},
onPostRender() {
const btn = this
editor.on('init', () => {
editor.formatter.formatChanged('h2', state => {
btn.active(state)
})
})
}
})
editor.addButton('p', {
title: '正文',
text: '正文',
onclick() {
editor.execCommand('mceToggleFormat', false, 'p')
},
onPostRender() {
const btn = this
editor.on('init', () => {
editor.formatter.formatChanged('p', state => {
btn.active(state)
})
})
}
})
}
}) })
}, },
methods: { destroyTinymce() {
window.tinymce.get(this.tinymceId).destroy()
},
setContent(value) { setContent(value) {
window.tinymce.get(this.tinymceId).setContent(value) window.tinymce.get(this.tinymceId).setContent(value)
}, },
@ -164,7 +143,7 @@ export default {
} }
}, },
destroyed() { destroyed() {
window.tinymce.get(this.tinymceId).destroy() this.destroyTinymce()
} }
} }
</script> </script>