写在前面学习、写作、工作、生活，都跟心情有很大关系，甚至有时候我更喜欢一个人独处，戴上耳机coding的感觉。明显现在的心情，比中午和上午好多了，心情超棒的，靠自己解决了两个问题：新增的时候点击TreeSelect控件控制台会给出报错分类新增和编辑时，报错父类和电子书iD不能为空的问题富文本插件wangeditor的使用官网地址：https://www.wangeditor.com/1、安装npmiwangeditor@4.6.3--save2、使用npm安装importEfrom'wangeditor'consteditor=newE('#div1')//或者consteditor=newE
1、安装使用安装yarnadd@wangeditor/editor#或者npminstall@wangeditor/editor--saveyarnadd@wangeditor/editor-for-vue#或者npminstall@wangeditor/editor-for-vue--save 在main.js中引入样式import'@wangeditor/editor/dist/css/style.css' 在使用编辑器的页面引入js import{Editor,Toolbar}from"@wangeditor/editor-for-vue";components:{Editor,Tool
需求背景：富文本编辑器需要实现：1.PC端可实现随意图片设置超链接，移动端点击图片跳转设置的超链接2.PC端可实现随意选中文字设置超链接，移动端点击文字跳转设置的超链接3.PC端富文本编辑器可以快速上传大视频，不经后端直传阿里云oss4.图片复制粘贴回显，复制过来文字字体样式不变PC端使用的是若依系统前后端分离框架，vue2框架，调研一段时间后决定原quill富文本编辑器弃用，改成最新版本wangEditorV5版本可以实现所有需求wangEditorv5版本官网链接：优势|wangEditor若依系统官网：http://www.ruoyi.vip/安装：npminstall@wangedit
官方文档 项目中要求实现富文本编辑器取编辑内容这种编辑器有好多选择了wangeditor富文本编辑器首先根据文档安装yarnadd@wangeditor/editor#或者npminstall@wangeditor/editor--saveyarnadd@wangeditor/editor-for-vue@next#或者npminstall@wangeditor/editor-for-vue@next--save再按照官方的指引cv如下代码import'@wangeditor/editor/dist/css/style.css'//引入cssimport{onBeforeUnmount,ref
第一步：安装yarnadd@wangeditor/editor#或者npminstall@wangeditor/editor--saveyarnadd@wangeditor/editor-for-vue@next#或者npminstall@wangeditor/editor-for-vue@next--save第二步：使用//htmlimport{getCurrentInstance,ref,onMounted,shallowRef,reactive,onBeforeUnmount}from"vue"import"@wangeditor/editor/dist/css/style.css"im
1.wangEditor5介绍wangEditor5——轻量级web富文本编辑器，配置方便，使用简单。支持IE10+浏览器。官网：www.wangEditor.com2.下载注意：wangeditor都是小写字母//下面两个依赖都需要安装npmi@wangeditor/editor//使用ts时，引入相关类型声明npmi@wangeditor/editor-for-react3.相关概念和API3.1组件Editor:编辑器组件Toolbar：菜单栏组件import'@wangeditor/editor/dist/css/style.css'//引入cssimport{Editor,Toolb
复制粘贴修改一下直接用，也写了相关的注释。一、安装相关插件npminstall@wangeditor/editornpminstall@wangeditor/editor-for-vue二、官方关键文档ButtonMenu：https://www.wangeditor.com/v5/development.html#buttonmenu注册菜单到wangEditor：自定义扩展新功能|wangEditorinsertKeys自定义功能的keys:https://www.wangeditor.com/v5/toolbar-config.html#insertkeys自定义上传图片视频功能:菜单配
一、需求分析，问题描述1、需求使用富文本进行内容编辑，要求自定义工具栏菜单顺序及其分组，并且要求自定义选择图片、自定义选择视频。2、问题如何配置开始使用？如何自定义工具栏菜单的展示？如何自定义工具栏内置菜单的功能？如何自定义扩展新功能菜单？二、解决问题，答案速览实现代码如下，复制粘贴即可直接使用。如果你有时间，具体问题梳理、代码分析、知识总结，可见第三部分。1、配置开始使用（1）下载依赖npmi@wangeditor/editor@wangeditor/editor-for-vue（2）引入css和内置组件//引入cssimport'@wangeditor/editor/dist/css/st
前言因为老大突然说网站后台负责维护的人员上传到富文本(为了SEO就不用贴图)的内容,一些图片显示失败,我一看还真是之前好不容易弄好这个富文本的图片上传功能(就是点击图片,选择上传)还真没有想到他们直接扒过来别的网站内容(尤其里面包含图片)这时候加入这个网站设置跨域,图片就会因为跨域显示403失败,无法加载出来.吐槽:还以为他们富文本把文字写好,在一个个上传图片,组成一片文章.那就没有办法了,只能修改下代码增加下自动上传图片功能.后来写到一半才发现html有个属性好像可以让跨域的图片显示出来.暂时不太理解这个代码,也不清楚有没有副作用,希望有懂的大佬说下.以为这样就可以不用写了,但是老大说万一以
在Vue项目中使用WangEditor编辑器的详细教程WangEditor是一个基于JavaScript的富文本编辑器，提供了丰富的编辑功能和灵活的定制能力。以下是WangEditor的一些优点：易于集成和使用：WangEditor提供了清晰的API和文档，易于集成到各种前端项目中，无论是基于Vue、React还是其他框架。功能丰富：WangEditor提供了丰富的编辑功能，包括文字字号、加粗、斜体、下划线、插入图片、表格、链接等。同时，还支持自定义扩展功能和插件，满足特定业务需求。支持多种浏览器：WangEditor在多种主流浏览器上保持良好兼容性，包括Chrome、Firefox、Safa
