在vue使用wangEditor(简单使用)

wangEditor不同的版本使用方法都不一样,这里以目前最新的参考官网方法使用2023-09-28

 首先安装,参考官网,注意editor跟editor-for-vue两个都要装

yarn add @wangeditor/editor
# 或者 npm install @wangeditor/editor --save

yarn add @wangeditor/editor-for-vue
# 或者 npm install @wangeditor/editor-for-vue --save

然后就是参考官网示例操作就好了,官网有现成的代码示例,这里再加点注意事项注释

全部代码:





最终效果:

简易模式

在vue使用wangEditor(简单使用)_第1张图片

由于我自定义了Toolbar的菜单配置所以覆盖了原本的默认菜单,如果不自定义将使用默认的菜单配置

自定义菜单:

在vue使用wangEditor(简单使用)_第2张图片

你可能感兴趣的:(vue.js,javascript,前端)