Vue3中使用富文本编辑器

在vue3中我们可以使用@wangeditor/editor、@wangeditor/editor-for-vue来实现其功能

npm地址：https://www.npmjs.com/package/@wangeditor/editor-for-vue/v/5.1.12?activeTab=readme

官网：Editor 

1. 安装

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

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

 2. 组件封装

@/comps/Editor/index.vue 

首先为了能让vue认识@wangeditor/editor-for-vue库、我们可以在.d.ts中声明一下即可

// 声明外部 npm 插件模块
declare module '@wangeditor/editor-for-vue';

3. 使用 

4. 效果