Vue3学习(二十)- 富文本插件wangeditor的使用
写在前面
学习、写作、工作、生活,都跟心情有很大关系,甚至有时候我更喜欢一个人独处,戴上耳机coding的感觉。

明显现在的心情,比中午和上午好多了,心情超棒的,靠自己解决了两个问题:
- 新增的时候点击
TreeSelect控件控制台会给出报错 - 分类新增和编辑时,报错父类和电子书iD不能为空的问题
富文本插件wangeditor的使用
官网地址:https://www.wangeditor.com/
1、安装
npm i wangeditor@4.6.3 --save
2、使用 npm 安装
import E from 'wangeditor'
const editor = new E('#div1')
// 或者 const editor = new E( document.getElementById('div1') )
editor.create()
3、在表单中使用
在form中加入标签,示例代码如下:
<a-form-item label="内容">
<div id="content"></div>
</a-form-item>
setup(){
const editor = new E("#content")
const add(){
editor.create();
},
const edit(){
editor.create();
}
}
4、效果:

写在最后
这里给广大网友个建议,就是学习要讲究时效性,比如你找的学习资料,看下是否严重超时,要么就会因为版本或者环境差异问题,足够你搞个1-2天了,哈哈,我上午大部份时间就是在搞环境,还好目前没任何遗留问题,感觉在变强中!
Vue3学习(二十)- 富文本插件wangeditor的使用的更多相关文章
- Python3.5 学习二十四
本节课程大纲: -------------------------------------------------------------------------------------------- ...
- 基于bootstrap的富文本框——wangEditor【欢迎增加开发】
先来一张效果图: 01. 引言 老早就開始研究富文本框的东西,在写完<深入理解javascript原型与闭包>之后,就想着要去做一个富文本框的插件的样例. 如今网络上开源的富文本框插件许多 ...
- 小程序快速部署富文本插件wxParser
为了解决html2wxml在ios下字体过大问题,又发现一个比较好用的富文本插件:wxParser. 目前 wxParser 支持对一般的富文本内容包括标题.字体大小.对齐和列表等进行解析.同时也支持 ...
- 【富文本、JS】将接口传来的全部纯URL替换为富文本插件能识别到的img标签
replaceURLWithImage (text) { var a = /(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0 ...
- 【改】iOS学习之NSAttributedString(富文本)
NSAttributedString 叫做富文本,是一种带有属性的字符串,通过它可以轻松的在一个字符串中表现出多种字体.字号.字体大小等各不相同的风格,还可以对段落进行格式化,一般都是对可变富文本(N ...
- 轻量级富文本编辑器wangEditor源码结构介绍
1. 引言 wangEditor——一款轻量级html富文本编辑器(开源软件) 网站:http://www.wangeditor.com/ demo演示:http://www.wangeditor.c ...
- iOS学习之NSAttributedString(富文本)
NSAttributedString 叫做富文本,是一种带有属性的字符串,通过它可以轻松的在一个字符串中表现出多种字体.字号.字体大小等各不相同的风格,还可以对段落进行格式化,一般都是对可变富文本(N ...
- 小程序解析html之富文本插件wxParse
近期,开发小程序时,遇到后台给我返回了一串html代码,需要我这边来解析,头疼了好久,网上找资料找了变天,终于找到wxParse,然而看到的都是针对于页面中有单个html或者固定数据的,我现在的问题是 ...
- 富文本(wangEditor框架)的使用教程
富文本的使用教程(wangEditor框架) 一,相信很多人用过很多富文本的框架,现在我向大家推荐一个很实用的一个富文本框架,具有丰富的功能项,容易使用. 所以本博客介绍这个富文本编辑器的使用哈!觉得 ...
- PyQt(Python+Qt)学习随笔:富文本编辑器QTextEdit功能详解
专栏:Python基础教程目录 专栏:使用PyQt开发图形界面Python应用 专栏:PyQt入门学习 老猿Python博文目录 一.概述 QTextEdit是一个高级的所见即所得的文档查看器和编辑器 ...
随机推荐
- [转帖]Linux中split大文件分割和cat合并文件详解
https://www.yingsoo.com/news/servers/70195.html 当需要将较大的数据上传到服务器,或从服务器下载较大的日志文件时,往往会因为网络或其它原因而导致传输中断而 ...
- [转帖]Linux 中unzip解压时中文乱码的解决办法
https://www.yii666.com/blog/163883.html Linux 中unzip解压时中文乱码的解决办法 当我们在linux中解压一个含有中文名字的压缩包如"资料.z ...
- 你也能成为“黑客”高手——趣谈Linux Shell编程语言
作者:京东零售 杜兴文 我们看过很多在电脑命令行敲一些命令并给观众展示很高科技的画面感的电影,比如<盗梦空间><操作系统革命><代码>等等, 再想想电影黑客帝国中的 ...
- echarts更改x和y轴的颜色
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- vue报错:'XX' is defined but never used no-unused-vars
参考地址:http://www.gold404.cn/info/87 导致这个报错的原因就是eslint校验, 就是你当初在vue创建脚手架的时候选择了eslint校验: 后面你绝对会碰到这样的报错, ...
- VictoriaMetrics 1.80版本中值得关注的新特性
作者:张富春(ahfuzhang),转载时请注明作者和引用链接,谢谢! cnblogs博客 zhihu Github 公众号:一本正经的瞎扯 change log请看:https://github.c ...
- React中引入外部js文件
假设需要引入本地的一个jquery库: <script src="http://127.0.0.1:8080/plugins/jquery.min.js" type=&quo ...
- 设计模式学习-使用go实现命令模式
命令模式 定义 优点 缺点 适用范围 代码实现 命令模式对比策略模式 参考 命令模式 定义 命令模式(Command):将一个请求封装成一个对象,从而是你可用不同的的请求对客户进行参数化:对请求排队或 ...
- 2.5 Windows驱动开发:DRIVER_OBJECT对象结构
在Windows内核中,每个设备驱动程序都需要一个DRIVER_OBJECT对象,该对象由系统创建并传递给驱动程序的DriverEntry函数.驱动程序使用此对象来注册与设备对象和其他系统对象的交互, ...
- iOS 17.4 测试版包含大模型相关代码
外界普遍预计苹果将在 6 月份通过 iOS 18 推出主要的新人工智能功能.不过根据 9to5Mac 的报道,他们在 iOS 17.4 第一个测试版中发现的代码表明,苹果正在开发由大语言模型技术支持的 ...