自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(45)
  • 资源 (1)
  • 收藏
  • 关注

原创 苹果文本动态高亮,滚动时候部分高亮不显示问题

苹果文本动态高亮,滚动时候部分高亮不显示问题

2023-12-11 19:11:47 439

原创 css案例:小黄人案例

css案例:小黄人案例先看效果图眼睛和嘴巴有做动画的,但是我懒得上传gif了。3. 源码 html<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8"> <style> .contain { width: 400px; height: 600px; border: 1px solid #000; margin: 0 auto;

2023-04-22 23:05:21 566 1

原创 [Vue warn]: Failed to mount component: template or render function not defined.报错解决

[Vue warn]: Failed to mount component: template or render function not defined.报错解决

2022-11-11 18:44:09 5123

原创 记录最近vant使用遇到的问题

记录vant使用问题

2022-10-08 17:32:07 1545

原创 elementUI表格滚动条修改(完整版)

element-ui中的表格el-table滚动条样式修改(完整版)

2022-08-26 13:38:33 2290

原创 image-conversion库压缩png图片背景黑色问题解决

首先说一下,压缩主要是通过减低清晰度和缩小图片宽高进行的。使用这里不讲,请看官方结束: https://www.npmjs.com/package/image-conversion1.问题分析由于项目需要压缩图片上传oss,一开始使用image-conversion库,但是发现某写png格式图片透明背景压缩后会变成黑色,看了源码,其实问题就出现在canvas转base64的方法上/** * 将一个Canvas对象转变为一个dataURL字符串 * 该方法可以做压缩处理 * * @param

2021-12-10 18:24:36 4723 1

原创 vue 配置axios拦截重复的请求

描述: 拦截重复请求就是防止一时间发起多个一样的请求造成系统卡顿, 比如网速较慢时用户频繁点击发起请求, 这边我也看了很多博客学习如何配置比较好,然后看了又 不太明白 axios是如何取消之前的请求的, 原理是怎么样?? 很多博客都没说,只是贴了代码, 官网也有,但是还是只是明白了大概, 所以我这边还是自己总结一下:可以先去看看官网描述:官网描述大致原理(后面会贴源码分析,当然,那是大佬分析的,不是我这个菜鸡):其实就是 我们 通过官网提供的 CancelToken.source 工厂方法创建 c

2021-11-11 16:34:56 2784 1

原创 vue配置axios添加全局loading

描述: 添加全局loading目的是减少页面写v-loading指令, 这样我们只需要配置参数就可以控制每个请求是否需要loading,并且可以配置正在loading的元素, 这里通过请求时配置header参数进行控制, 网上都有教程了,这里也是记录一下,方便自己以后查看.实现代码:我loading方法放在utils文件夹下import { debounce } from "./funDebounce";//import { Loading } from 'element-ui' // 装包方式这样

2021-11-11 15:47:47 3825 4

原创 element级联选择器懒加载 单选和多选 回显解决方法

级联回显解决**问题:单选的回显:多选的回显:**问题:项目需求是 级联选择器懒加载, 并且级联选择器有单选的回显和多选的回显, 一开始 单选还觉得挺容易, 但是多选 就 花了些时间研究才做出了.特地记录一下,因为没有看到讲的比较清楚的**单选的回显:注意点:(1) 单选回显只需要绑定 回显的 id 即可, 会自动根据id发起异步请求(2) 回显id 要是 一条链, 就是 当前节点di和这个节点所有父级id, 一个数组,如[‘1’,‘2’](3) 要触发自动发起异步请求, 需要第一次懒加载

2021-10-09 19:43:43 7493 32

原创 html转pdf 图片跨域问题解决

之前文章说了, 我这边图片是阿里云的地址, 默认在页面 分页 用Img标签展示, 点击导出的时候再请求一次后端拿回全部 数据 展示(这里展示是定位到其他地方,不遮住原来页面, 然后导出完毕这个页面就销毁了这样 ) , 这时导出就报跨域了.1. 问题分析:这里来自这位大佬分析, 我场景差不多也是这样.https://www.jianshu.com/p/8fa0fb53c183 一个关于image访问图片跨域的问题也就是我页面 一开始就默认 展示一次图片了, 后面又通过js 导出pdf方式使用这个 图

2021-10-09 18:39:42 1892

原创 vueCli4 安装 sass

我之前就知道安装sass要注意版本问题,之前也做了笔记,但是今天安装我忘了我以前的笔记写在哪里了(????????????),安装了几次和换版本也没解决,网上有些说的也不清楚,经过尝试,记录一下,下次安装自己看。第一种:直接装这两个就可以了,不需要node-sass也没问题,需要重跑一下项目。npm install sass@1.26.5 --save-devnpm install sass-loader@8.0.2 --save-dev第二种:用这两个版本npm install sass-

2021-10-06 23:27:16 588 2

原创 Windows实现流媒体服务器搭建 ngnix+rtmp+ffmpg+hls实现播放rtmp和HLS/m3u8直播流

前言:最近在学直播相关知识点,也看了好多博客,一开始总是拉流没成功,所以做一下笔记,笔记包括参考网上其他博客和自己总结的地方????1.简介和工具准备????Nginx是一款轻量级的Web 服务器/反向代理服务器及电子邮件(IMAP/POP3)代理服务器。 nginx-rmtp-module是Nginx服务器的流媒体插件。nginx通过rtmp模块提供rtmp服务, ffmpeg推送一个rtmp流到nginx, 然后客户端通过访问nginx来收看实时视频流,这里默认大家对rtmp,hls等协议有了解了

2021-07-23 20:29:44 8286 21

原创 windows下nginx的rtmp配置加载问题 unknown directive “rtmp“

我一开始直接在文件夹下打开powershell,然后输入命令就报这个,以为是配置问题,但是没检查出什么![在这里插入图片描述](https://img-blog.csdnimg.cn/20210720090327734.png?x-oss-process=image/解决:不要通过powershell打开吗,直接通过cmd打开到当前路径,然后就可以了...

2021-07-20 09:10:59 1516 2

原创 摸鱼复习css2

可继承属性所有元素:visibility、cursor列表元素:list-style、list-style-type、list-style-position、list-style-image字体属性:line-height、color、font、font-family、font-size、font-style、font-variant、font-weight、font-size-adjust表格布局属性:caption-side、border-collapse、border-spacing、empt

2021-07-16 17:23:56 99

原创 摸鱼复习一下css1

1.事件绑定和移除btn.onclick = function () {} -------btn.onclik = nulladdEventLister(‘click’,fn) ----removeEventLister(‘clcik’,fn)----------回调函数不能写匿名函数才能解绑ie9-ie10: btn.attachEvent(‘onclick’, fn);----------btn.detachEvent(‘onclick’,fn)2.居中几种方式(子盒子在父盒子居中)水

2021-07-16 17:04:02 127

原创 video同层级、禁用进度条等兼容问题

基于video.js使用问题这些问题都是我项目遇到的,我项目是视频设置问题点, 用户观看时不能点击进度条快进,看过的可快进,遇到问题点会暂停弹出问题,回答正确才能继续观看,回答错误返回上一个问题的位置重新观看,并且要记录用户观看位置,下次进来提示 是否 要跳转到上次观看的位置,包括pc端和手机web端, 目前遇到最大问题就是测试移动端兼容问题,花了很多时间,稍作总结,总体可以。就是对于浏览器兼容效果还是不能全部兼容,因为video标签实在无解,后面也尝试换插件试试,比如西瓜播放器, 但是经过测试,也没有解

2021-07-11 18:34:21 1845

原创 vue引入video.js中文包

如果需要把视频提示更换成中文,那么需要引入中文包,默认安装的中文包在node_modules/video.js/dist/lang/zh-CN.jsx下可以看出需要设置全局vedeojs,在main.js引入然后设置配置为中文就行了

2021-05-27 13:31:33 1779

原创 vue实现HTML转PDF(回炉重制升级版)

最近有需求做表单导出,就又花时间研究了一下html转图片导出,前面也做过证书打印,但是前面只是一页pdf没什么问题,今天想试试多页pdf导出会有什么问题,果然,问题很多,我搞了一早上,唉,如下(先说问题,后面再说导出方法哈)html转Pdf问题点1.文字显示有问题,总是有一个字显示不全2.图片显示问题**3.设置页边距****4.水印****5.清晰度****6. 滚动影响**实现方法:**1.全部内容导出一张pdf****2.a4分页导出**问题点1.文字显示有问题,总是有一个字显示不全这里我发

2021-05-19 19:27:15 13657 58

原创 记录1 Vue实现 html转PDF

html转PDF我的需求是 自动生成证书 并导出 pdf, 在网上大家都说用这两个插件,经过测试使用,也遇到了问题,就记录一下遇到的问题。1,下载插件模块npm install html2canvas jspdf --save2,定义功能实现方法在项目工具方法存放文件夹utils中创建htmlToPdf.js文件,我的代码如下,我这里包含了图片下载,不需要的去掉就好:// 导出页面为PDF格式import html2Canvas from 'html2canvas'import JsPDF

2021-04-30 16:30:48 1909 6

原创 vue 生成 证书模板 并支持 图片下载和导出PDF的demo

demo 使用的是html2canvas 和jspdf 插件, 不明白的先去看这个下面是我的一个例子,大家可以参考:注意: 请先看上面文章,安装插件和配置,这里不重复说了哦index.vue<template> <div> <h3>html转pdf下载</h3> <!-- <div id="pdfDom" > <div class="box"> <p class="tit

2021-04-30 16:29:10 4120 4

原创 小白 学习 vue+nodejs+mongodb部署项目到阿里云

vue+nodejs+mongodb部署项目到阿里云这是我毕设,想学下项目部署,然后搞了两天,终于成功了哈哈,这个部署过程参考链接如下,写的很好,我自己也做了一遍笔记,更详细介绍了过程,跟着步骤就行,我也是第一次部署哈哈。https://segmentfault.com/a/11900000229219081.项目环境如下:部署时间: 2020年4月20号本地环境: windows 10服务器: 阿里云服务器 ECS 型, CentOS 8.0; 主要使用宝塔面板(这个是liunx可视化管

2021-04-21 13:33:46 1568 12

原创 移动端禁止页面滚动,超简单

先说说我自己需求: 点击顶部菜单按钮会弹出菜单选项,然后背景有一个遮罩效果,此时菜单选项出现要求禁止页面滚动,关闭才能继续滚动解决: 因为即使加了遮罩如果页面高度大于手机高度默认还是可以滚动的,网上有很多解决方法,我也看过试过,有些还要计算已经滚动的高度,因为有个方法是禁用了会自动弹回顶部,大概网上方法有:方法1:设置监听事件,阻止默认事件行为bug->遮罩弹出页面自动置顶,需要计算滚动距离,烦$("body").css({  position: "fixed",  width: "100

2021-02-01 11:09:41 4312

原创 连接mongodb时show dbs 提示“command listDatabases requires authentication“验证

今天想重新创建一个带有密码的数据库,之前用的时候创建过,所以这次直接进powershell操作时,发现需要验证: command listDatabases requires authentication那么验证就可以啦,不过要有之前创建时候的用户名和密码,我当时admin啥都是root, 所以直接切换到admin验证就行了use admindb.auth(“root”, “root”)1返回1就验证成功了...

2020-12-29 23:37:52 13454 1

原创 node笔记:node express 下 jsonwebtoken+express-jwt实现token登录验证两种方式(尽力写详细了)

之前用过token,也知道是用来授权的,但是不知道后端如何生成,为什么一定要用token,token又是怎么验证的等等,希望这篇文章帮到和我一样学啥忘啥的笨蛋…1.简单了解JWT1.JWT 的数据结构eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJkYXRhIjp7fSwidHlwZSI6ImV4cHJlc3Mtand0IiwiY3RpbWUiOjE2MDkwNzk0OTkzMzYsImlhdCI6MTYwOTA3OTQ5OSwiZXhwIjoxNjA5MDgzMDk5

2020-12-28 01:05:10 25435 7

转载 HTML笔记:DOMContentLoaded和load的区别

看到这个说的比较好,就转载作为笔记,方便自己复习时候看看.来源(建议看她写的,比较美观): https://www.cnblogs.com/gg-qq/p/11327972.html作者:guo&qi一、概念DOMContentLoaded  当初始的 HTML 文档被完全加载和解析完成之后,DOMContentLoaded 事件被触发,而无需等待样式表、图像和子框架的完成加载。load  load 仅用于检测一个完全加载的页面,页面的html、css、js、图片等资源都已经加载完

2020-12-26 00:01:16 1210

原创 vue cli3配置使用svg (记录踩过的坑)

SVG简单理解svg简单理解svg 图标组成元素svg 和 直接引入图标(iconfont下载图标引入方式)的优缺点vue cli3 项目使用svg步骤(想直接学会用的点这里)总结简单理解svg简单理解svg图标优缺点比较vue cli3 项目使用svg步骤总结简单理解svg简单理解svg 图标组成元素svg 和 直接引入图标(iconfont下载图标引入方式)的优缺点vue cli3 项目使用svg步骤(想直接学会用的点这里)总结简单理解svgSVG 指可伸缩矢量图形 (Scalable V

2020-12-18 23:52:01 2328 4

原创 VSCode配置 Debugger for Chrome插件(终于搞定了..)

今天重装了vsCode,重新安装了插件,配置这个调试插件时花了一个小时…好菜,因为我按网上教程配置了出现断点灰色,调试不了的问题,所以我找解决方法…现在半夜两点了,我要秃了…才刚入行哈哈哈哈哈哈进入正题:Debugger for Chrome这款插件是专门为前端调试开发的,很方便调试,跟谷歌的控制台是一样的功能,下载了它就不用打开浏览器的控制台就能进行打断点。1.安装Debugger for Chromec插件2.配置launch.json文件这个文件怎么打开?安装了插件右边会多出调试按钮,点

2020-11-29 02:35:07 12675 1

原创 vue笔记:总结一下vuex,以后面试看下

最近又复习了下vuex,还是因为自己太菜了,最近在想mutations和actions,这样分同步和异步目的是什么?之前学了感觉没啥,现在又有点疑问,所以又总结了一下,后面有新想法再回来改哈哈…从vuex原理复习:先看图:Vuex为Vue Components建立起了一个完整的生态圈,是一个状态管理器。核心流程:① Vue Components 是我们的 vue 组件,组件会触发(dispatch)一些事件或动作,也就是图中的 Actions;② 我们在组件中发出的动作,肯定是想获取或者改变数

2020-11-28 22:51:57 504

原创 js: offset,client,scroll 获取元素宽高区别(简单好理解)

1.offsetoffsetWidth/Height :获取盒子宽/高度–包括内容+padding+borderoffsetLeft/Top: 获取距离最近的offsetParent的距离 —距离包括offsetparent的padding,不包括borderoffsetParent一个元素的offsetParent可以是以下其中之一:具有position属性(除了static值以为)的最近父元素;最近的table,table cell父元素;根节点元素(body);设置了动画t

2020-11-17 16:37:39 376

原创 css笔记:包含快的理解

指出错误观念许多开发者认为一个元素的包含块就是他的父元素的内容区,其实这是错误的(至少不完全正确)!一个元素的尺寸和位置经常受其包含块的影响。大多数情况下,包含块就是这个元素最近的祖先块元素的内容区,但也不是总是这样。下面我们看看盒模型:当浏览器展示一个文档的时候,对于每一个元素,它都产生了一个盒子。每一个盒子都被划分为四个区域:内容区内边距区边框区外边距区什么是包含块?包含块有分为根元素包含块和其他元素的包含块。根元素包含块根元素html的包含块是一个矩形,叫做初始化包含块(ini

2020-11-17 15:53:12 726

原创 js深拷贝,解决循环引用

浅拷贝和深拷贝都是对于JS中的引用类型而言的,浅拷贝就只是复制对象的引用,如果拷贝后的对象发生变化,原对象也会发生变化。只有深拷贝才是真正地对对象的拷贝。浅拷贝浅拷贝的意思就是只复制引用,而未复制真正的值。const originArray = [1,2,3,4,5];const originObj = {a:'a',b:'b',c:[1,2,3],d:{dd:'dd'}};const cloneArray = originArray;const cloneObj = originObj;

2020-11-10 11:25:43 2746

原创 CSS笔试题: 实现表格首行首列固定和自适应窗口

今天校招笔试题要求实现一个首行首列固定,宽度自适应窗口变化,但窗口缩小到一定宽度不能再缩小,出现水平滚动条…当时我写错了,我一时想不起改用什么办法首行首列固定,用绝对定位,父亲相对定位…这样会有很多问题要解决…所以回来我学了一下,以前教程没学过这些属性,涨知识了哈哈…先了解几个概念:table-layout:table-layout属性有两种特定值:auto(预设值)-表格的总宽度决定每一个储存格(cell)的最大值fixed - 表格的总宽度决定于表格width的定义,以及各栏位(colum

2020-11-09 19:10:28 1307 2

原创 经典笔试题:一个页面从输入URL到页面加载显示完成,这个过程都发生什么?

笔记是我自己总结的,不对的地方多多指出~整体过程:1.首先,在浏览器地址栏输入url,回车2.根据Url,浏览器先查看浏览器缓存-系统缓存-路由缓存…,如果缓存中有,会从缓存中读取并显示,若没有,则跳到第三步3.在发送http请求前,先进行DNS域名解析,获取访问的IP地址4.浏览器向服务器发起tcp连接,与浏览器建立tcp三次握手。5.握手成功后,浏览器和服务器已经建立了通信,浏览器向服务器发送http请求,请求数据包。6.服务器接收到请求,处理请求并返回url指定数据给浏览器。7.浏览器

2020-11-08 22:33:03 1761

原创 Vue2020面试题:推荐我看过比较好的

12个vue高频原理面试题(附分析)https://www.php.cn/js-tutorial-455048.html2.2020年3月份最新vue面试题汇总一https://blog.csdn.net/qq_41646249/article/details/104644647?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-1.add_param_isCf&depth_...

2020-11-05 17:09:18 147

原创 Vue笔记:生命周期

面试题:说一下Vue的生命周期beforeCreate是new Vue()之后触发的第一个钩子,在当前阶段data、methods、computed以及watch上的数据和方法都不能被访问。created在实例创建完成后发生,当前阶段已经完成了数据观测,也就是可以使用数据,更改数据,在这里更改数据不会触发updated函数。可以做一些初始数据的获取,在当前阶段无法与Dom进行交互,如果非要想,可以通过vm.$nextTick来访问Dom。beforeMount发生在挂载之前,在这之前template模

2020-11-05 16:49:02 564

转载 vue笔记:v-if和v-for不能在同一标签使用

在vue实际开发中,我们避免不了会使用v-for和v-if来操作数据,但是v-for和v-if同时使用时,有一个先后运行的优先级,v-for比v-if的优先级更高,这就说明在v-for的每次循环运行中每一次都会调用v-if的判断,所以不推荐v-if和v-for在同一个标签内同时使用一、理解:v-for比v-if优先,如果每一次都需要遍历整个数组,将会影响速度,尤其是当之需要渲染很小一部分的时候。如果连用的话会把 v-if 给每个元素都添加一下,会造成性能问题。一般时候把v-if放在外层,如果不符

2020-11-05 12:23:04 1012

原创 前端菜鸟笔记:看了就懂的 URL

这是我学习过程的总结,如果有不对的地方多多指出,一起学习!URL/URN/URIURIURI,统一资源标识符(Uniform Resource Identifier, URI),表示的是web上每一种可用的资源,如 HTML文档、图像、视频片段、程序等都由一个URI进行标识的。包括三个部分(1.主机名 2.标识符 3.相对URI)URLURL是Uniform Resource Locator(统一资源定位器)的缩写,它表示Intent上某一个资源的地址。通过URL能够访问Intent上的各种资

2020-10-25 15:58:45 1334 2

原创 一篇弄懂清除浮动方法

清除浮动方法所谓浮动,就是指盒子脱离标准流。浮动的性质:脱标、贴边、字围、收缩。清除方法1加高法:浮动的元素,只能被有高度的盒子关住。 也就是说,如果盒子内部有浮动,这个盒子有高,那么妥妥的,浮动不会互相影响。但是,工作上,我们绝对不会给所有的盒子加高度,这是因为麻烦,并且不能适应页面的快速变化。 1 <div> → 设置height 2 <p></p> 3 <p></p> 4 <p>

2020-10-12 18:04:59 233

原创 js单线程机制和envent Loop事件循环

这个我自己也做了总结和笔记,不过我觉得通过下面几篇文章就能理解js单线程运行和事件循环执行了,下面和大家分享我觉得不错的文章强烈推荐:一次弄懂Event Loop(彻底解决此类面试问题):https://juejin.im/post/6844903764202094606#heading-1javascript宏任务和微任务:https://www.cnblogs.com/fangdongdemao/p/10262209.htmljs-关于异步原理的理解和总结:https://blog.csdn.n

2020-10-11 15:50:18 138

原创 js垃圾回收机制个人总结

js垃圾回收机制JavaScript 中的内存管理是自动执行的,而且是不可见的。我们创建基本类型、对象、函数……所有这些都需要内存。带着这 4 个问题,来了解浏览器垃圾回收的过程,后面会逐一解答:浏览器怎么进行垃圾回收?浏览器中不同类型变量的内存都是何时释放?哪些情况会导致内存泄露?如何避免?weakMap weakSet 和 Map Set 有什么区别?什么是垃圾一般来说没有被引用的对象就是垃圾,就是要被清除, 有个例外如果几个对象引用形成一个环,互相引用,但根访问不到它们,这几个对象

2020-10-11 15:43:23 2452

video_test.zip

Windows实现流媒体服务器搭建 ngnix+rtmp+ffmpg+hls实现播放rtmp和HLS/m3u8直播流工具和测试代码

2021-07-23

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除