wangEditor富文本编辑器用法

该文详细介绍了如何在Vue项目中集成wangEditor,包括登录官网获取资源,安装编辑器,创建wangEditor.vue组件,引入并使用组件,以及通过子组件的onChange事件传递富文本内容至父组件。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1.登录官网     https://www.wangeditor.com/v5/for-frame.html#vue2

2.安装      两个都装,保险起见

npm install @wangeditor/editor --save
npm install @wangeditor/editor-for-vue --save

3.建一个wangEditor.vue组件,将文档里面的东西全部放进这个wangEditor.vue组件里面,

4.在其他要用到富文本的组件里面引入注册这个wangEditor.vue组件,

5.最后怎么传值呢?就是通过wangEditor.vue组件里面的

 onChange(editor) {

       this.$emit('sendEditor', this.html)//通过子传父的方法将富文本里面的值传给引用富文本的组件

        },

6.最后就是一些配置的小问题,自己看就行

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值