插件名称 | vue-wysiwyg |
---|---|
发布时间 | 2020年4月15日 |
插件作者 | mycurelabs |
一个简单的干净的所见即所得编辑器组件,用于注释,CMS,博客等。
# Yarn
$ yarn add @mycure/vue-wysiwyg
# NPM
$ npm install @mycure/vue-wysiwyg --save
1.安装后导入组件。
import VueWysiwyg from '@mycure/wysiwyg';
2.在模板中创建一个WYSIWYG编辑器组件。
<template>
<div>
<mc-wysiwyg v-model="html"></mc-wysiwyg>
</div>
</template>
export default {
components: {
McWysiwyg
},
data () {
return {
html: ''
}
}
}
3.使用hide
prop隐藏编辑器按钮。所有可能的按钮:
<template>
<div>
<mc-wysiwyg v-model="html" :hide="hide"></mc-wysiwyg>
</div>
</template>
export default {
components: {
McWysiwyg
},
data () {
return {
html: '',
hide: {
// 编辑器隐藏按钮添加到这里
}
}
}
}