自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

AsBefore麦小兜

会有始料不及的运气、会有突如其来的欢喜

  • 博客(81)
  • 资源 (4)
  • 收藏
  • 关注

原创 nodejs 读取xlsx 文件转json 格式(包含表格时间类型)

需求概要:从xlsx 文件中读取内容转化成想要的json 格式,用于web 读取数据。本内容主要是更新前端公告内容,

2023-07-09 12:42:25 466

原创 Vue 项目更新,浏览器不需强制刷新就可更新版本! 防止缓存

禁止index 页面的缓存

2022-07-01 15:37:13 3211 1

原创 Js 文件图片URL 转Bolb 格式方法

// url 转bolb urlToBlob(the_url, callback) { let xhr = new XMLHttpRequest(); xhr.open('get', the_url, true); xhr.responseType = 'blob'; xhr.onload = function () { if (this.status == 200) { if (callback) {...

2022-02-11 22:10:55 1222

原创 连接字符串 换行

数组链接成字符串常用,连接'\r\n'let str = array.join('\r\n')展示出来的字符串可直接换行用作tooltip 展示时候的换行

2022-01-17 18:53:29 940

原创 底部操作菜单的吸底组件

因为样式问题底部菜单需要一直在视图内但界面的最下有一部分间隔空间于是使用吸底部的这个方式实现思想:找当前吸底的组件包含的dom 元素,是否在当前视图内,如果没在当前视图范围内,则需要设置position = 'fixed',bottom=0来实现布局,和吸顶是一样的思想<template> <div ref="stickyArea" :style="{ height: height + 'px', zIndex: zIndex }"> &lt

2022-01-06 19:41:43 611

原创 吸顶组件 开发

吸顶组件:页面滚动,顶部的标题要一直停留在当前页面页面滚动 这个标题吸顶组件实现思想是设置当前组件的position = 'fixed'组件:Sticky.vue<template> <div ref="stickyArea" :style="{ height: height + 'px', zIndex: zIndex }"> <div :class="className" :style="{ top:

2022-01-06 19:34:44 527

原创 关于列表的表单效验---根据不同种类,效验范围不同

当前这个表单是一个列表数据,列表里面的item都要根据第一个参数值的具体类型,来设置第三个参数值的的数据范围列如:当前后台需要的传输的数据类型是如下:[ { "monitorType": "CpuUsageAmount", "operator": 1, "value": 1, "durationTime": 1, "frequencyTime": 10 }, { "durationTime": 1, "f...

2022-01-06 19:23:28 713

原创 动态更新table的列或表头,table显示问题

问题记录:原本在table上,会根据不通的参数 使用一个表格,将一列数据进行显示和隐藏使用if 的时候 table 渲染的闪动体验太差于是使用自定义表头和内容但表头数据不会根据外部参数值变动最后的解决方案:给当前tabke 加一个key 属性使每一次渲染该表格都保证key 不同这样 就可以动态的变更当table 的列数在类型变化时,使key 自加...

2021-08-22 14:10:07 614

原创 from 表单效验 动态参数值的对比

问题记录:表单类型;效验规则: request的输入框内容数值不能大于limit 输入框的数值但from表单一般都是类似于这样的方法 只能接收到当前输入值于是将效验规则的方法bind(this )就可以在当前方法中使用 cpuMemoryRule: { requests: { cpu: [ { required: false, message: '请填写', trigger: ...

2021-08-22 14:01:28 256

原创 效验list 类型的from 表单方法

本周做了最大的表单的提交,对于必填和部分内容的表单做了完整的效验因为表单内容较多我这边封装了很多组件,对每一种类型都做了校验,所以在最外层的父组件使用$refs 找到子组件在找到子组件的from 表单进行效验当前表单含有list 类型的校验做下记录:表单大约分为常用的表单类型1、list类型当前组件是一个列表类型输入框 效验变量key 和value 值具体代码:实例图组件代码:<template> <div...

2021-08-22 13:53:47 781 1

原创 Table 动态添加列,from 表单列表效验无效

使用场景:变更上面的类型 要再table 表格上加一列最差使用如果只是对当前行 进行v-if 视图渲染的时候又闪动,体验很差,列表的的效验规则,对变动的那一列并不生效,解决方案:给table 加一个动态的key 属性保证每次变更视图 ,都渲染新的table完美解决!!!!...

2021-08-20 21:14:41 222

原创 vue 数据变动,但界面视图未发生变化

当前数据没有实现响应式使用$set ,在vue 上为当前属性绑定响应式使用this.$forceUpdate(); 强制刷新界面

2021-08-07 15:06:13 110

原创 switch的文字在内部显示效果

代码: <el-switch class="tableScopeSwitch" active-value="Y" inactive-value="N" @change="handleStatusChange(child_data)" active-text="开启" inactive-text="冻结" v-model="data.enable"> </el-switch>css 修改样式<style lan...

2021-07-25 15:33:14 482

原创 实现3D 图片轮播样式(触摸一体机浏览器存在滑动问题)

<div id="drag-container_view" class="padding_draw"> <div id="drag-container"> <div id="spin-container"> <div v-for="image in crbList" :key="image.id" class="image_item_div" :style="{backgr...

2021-07-25 15:25:29 232

原创 vue 3D轮播展示 --vue-carousel-3d

根据vue-carousel-3d 官方网站上面的实例 进行使用并修改官网地址:https://wlada.github.io/vue-carousel-3d/guide/使用流程:Installationnpm install -S vue-carousel-3dUsage (Global)import Vue from 'vue';import Carousel3d from 'vue-carousel-3d';Vue.use(Carousel3d);...

2021-07-25 15:18:11 1916 2

原创 解决 小程序界面数据不显示问题

遇到小程序获取向数据详情,后台返回的是个obj对象, 我直接setData到一个空对象苹果手机的页面不显示安卓手机可以显示

2021-06-14 18:17:34 2532

原创 时间格式转换

时间格式转换//转换时间类型 timeConversion(time) { let time_new = new Date(time); var a = [ time_new.getFullYear(), time_new.getMonth() + 1, time_new.getDate(), time_new.getHours(), time_new.getMinutes...

2021-05-26 09:09:27 69

原创 微信小程序 向上级页面传参

var pages = getCurrentPages(); var prevPage = pages[pages.length - 2]; prevPage.setData({ myType:1, myParme: that.data.myData.dynamic }) ...

2021-05-11 20:39:07 186

原创 数据库创建代码执行

/*Navicat MySQL Data TransferSource Server : 192.168.244.128Source Server Version : 50732Source Host : 192.168.244.128:3306Source Database : rebuild_3d_user_dbTarget Server Type : MYSQLTarget Server Version : 50732File.

2021-04-05 20:14:36 195

原创 Raw 图像转png

当前时封装了一个组件专门用于原水图像转png 图像全局引入pngtoy库 然后直接在组件中使用浏览器不支持显示16bit的原先是图像需要用到pngtoy 这个库 链接:https://github.com/xgds/pngtoy组件代码rawtopng.vue<template> <div> <canvas style="display:none" id="c"></canvas> <img...

2021-04-04 13:10:50 576

原创 vue 组件之间的传值

1,props、事件$emit 父组件向子组件传值(props)2、$emit、$on (Bus)通过新建Vue实例(Bus)作为中央事件总线(事件中心),用它来触发事件($emit)和监听事件($on),巧妙而轻量地实现了任何组件间的通信,包括父子、兄弟、跨级。当我们的项目比较大时,可以选择更好的状态管理解决方案vuex。3,$attrs、$listeners(属性,事件)多级组件嵌套需要传递数据时,通常使用的方法是通过vuex。但如果仅仅是传递数据,而不做中...

2021-04-01 12:37:47 743

原创 前端面试:webpack构建之loader与plugin的区别是什么

从功能区分loader是文件加载器能够加载资源文件并对这些文件进行统一的处理,诸如编译,压缩 最终一起打包在制定的文件夹中处理一个文件可以使用多个loader loader的执行顺序和配置顺序整好相反第一个执行的loader的返回值接收源文件内容做参数其他的loader接收前一个执行的loader的返回值作为参数 最后执行的loader会返回次模块的js源码编写zijipluginplugin的功能更加强大,loader不能做的,plugin都能做plugin..

2021-04-01 10:36:37 237

原创 前端面试:import 和 require 区别

1、遵循的规范不同require 是AMD规范引入方式import 是es6的一个语法标准,兼容浏览器要转换成es52、调用时间require是运行时调用,require是个函数所以require理论上可以运用在代码的任何地方import是编译时调用,所以必须放在文件开头 且放在全局中引入3、本质require是赋值过程,其实require的结果就是对象、数字、字符串、函数等,再把require的结果赋值给某个变量import是解构过程,但是目前所有的引擎都还没有实现im.

2021-04-01 09:08:44 1453

原创 vue 界面 滚动监听

<template> <div> <Carousel :carousel-data='carouselData' /> <sticky :z-index="10" class-name="sub-navbar"> <!-- 导航区域 --> <div class="navs"> .

2021-03-29 17:08:09 457 1

原创 vue 吸顶组件封装

主页面: <sticky :z-index="10" class-name="sub-navbar"> <el-tabs v-model="activeName" @tab-click="handleClick"> <el-tab-pane label="功能介绍" name="first"></el-tab-pane> <el-tab-pane label="功能演示" name="second"&g

2021-03-29 17:02:57 298

原创 web 实时播放 whammy.js

先在当前播放视频的页面混入wfsMixins.js/* eslint-disable no-undef */import '@/utils/statics/wfs';// import Wfs from '@/views/project/Dashboard/Mixin/wfs';export default { data() { return { wfs: new Wfs() }; }, watch: { windowHidden(val) .

2021-03-29 16:35:50 487 2

原创 新版chrome 解决在http协议下无法调用摄像头和麦克风的问题(不安全)

解决办法:亲测可行在浏览器地址栏中输入“chrome://flags/#unsafely-treat-insecure-origin-as-secure”,回车,如下图,将该选项置为Enabled,在输入框中输入需要访问的地址,多个地址使用“,”隔开,然后点击右下角弹出的Relaunch按钮,自动重启浏览器之后就可以在添加的http地址下调用摄像头和麦克风了。...

2021-03-05 09:20:16 10239 5

原创 小程序wxParse解析html格式内容(富文本) 出错

出错有两种1、空格没有被替换2、文字重叠wxParse解析空格会出错,这时候到wxParse文件夹的wxDiscode.js文件里面,将str = str.replace(/&nbsp;/g, ' ');修改为str = str.replace(/&nbsp;/g, '\xa0');文字重叠问题就解决了...

2021-01-24 17:06:31 488

原创 JS 对UTC 时间格式(2020-11-27T02:58:41.000000Z)转换成正常时间显示

timeChange(UTCDateString) { if (!UTCDateString) { return '-'; } function formatFunc(str) { return str > 9 ? str : '0' + str } var date2 = new Date(UTCDateString); console.log('时间', date2) var year = date2.getFull.

2020-11-30 09:23:16 1716

原创 js正则表达式过滤表情,输入法表情无法匹配,则反向判断

因为输入法表情正则无法匹配,那就匹配当前文本中,不是数字,标点,英文,汉字的字符,做基本的文本格式处理我这里用到的是替换,标点匹配不够全面,自行添加即可 var mytextarea = e.detail.value.mytextarea; mytextarea = mytextarea.replace(/[^\u4e00-\u9fa5a-zA-Z\d,\.,??.<>''"":;{}[\|、】【、‘;“”‘’;:。,)(*&……%¥#@!~。]+/g, "..

2020-10-28 11:27:41 1189

原创 JS 版本 斐波那契 (算法)

<!DOCTYPE html><html lang="en"><head> <title>斐波那契</title></head><body> <script> function fid1(n) { if (n <= 1) { return n } return.

2020-10-04 14:53:11 139

原创 算法4 1.3.3 练习

题目: function Stack() { this.dataStore = []; //保存栈内元素,初始化为一个空数组 this.top = 0; //栈顶位置,初始化为0 this.push = push; //入栈 this.pop = pop; //出栈 this.peek = peek; //查看栈顶元素 this.clear =.

2020-10-03 13:27:12 143

原创 JS版本:将缺少左括号的表达式补全括号之后打印出中序表达式 算法4 1.3.9

根据Java版本改编 但我还没看懂先记录一下 可用<!DOCTYPE html><html lang="en"><head> <title>study-vue</title></head><body> <script> function Stack() { this.dataStore = []; //保存栈内元素,初始...

2020-10-02 17:26:28 170

原创 回环变位算法

is//算法4 第一章 第二节,2.2.6isLoop(s,t){ return s.length()==t.length()&&((s+s).indexOf(t)>=0);}

2020-10-01 23:01:58 127

原创 canvas -实现扇形的选择拖拽

效果图<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>实现扇形的选择拖拽</title> <style> body{margin: 0;overflow: hidden} #canvas{background: antiquewhite;} </style>&l.

2020-09-26 17:12:27 189

原创 粒子时钟--发射动态--canvas 画布制作

效果图:具体代码:复制可运行<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>粒子时钟-完整版</title> <style> body { margin: 0; overflow: hidden } ..

2020-09-26 17:09:04 204

原创 实现刮刮乐动态效果

效果图代码:全部粘贴复制 可运行<!DOCTYPE html><html><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,user-scalable=no"> <title>刮刮乐-用鼠标擦除动态效果</title> <style> ...

2020-09-26 16:51:56 856

原创 HTTP的缓存的过程是怎样的?

通常情况下的步骤是:1. 客户端向服务器发出请求,请求资源2. 服务器返回资源,并通过响应头决定缓存策略3. 客户端根据响应头的策略决定是否缓存资源(这⾥假设是),并将响应头与资源缓存下来4. 在客户端再次请求且命中资源的时候,此时客户端去检查上次缓存的缓存策略,根据策略的不同、是否过期等判断 是直接读取本地缓存还是与服务器协商缓存...

2020-08-28 14:50:35 171

原创 HTTPS是如何保证安全的?

得先理解两个概念对称加密:即通信的双⽅都使⽤同⼀个秘钥进⾏加解密,⽐如特务接头的暗号,就属于对称加密优点:对称加密虽然很简单性能也好缺点:⽆法解决⾸次把秘钥发给对⽅的问题,很容易被⿊客拦截秘钥。⾮对称加密:1. 私钥 + 公钥=密钥对2. 即⽤私钥加密的数据,只有对应的公钥才能解密,⽤公钥加密的数据,只有对应的私钥才能解密3. 因为通信双⽅的⼿⾥都有⼀套⾃⼰的密钥对,通信之前双⽅会先把⾃⼰的公钥都先发给对⽅4. 然后对⽅再拿着这个公钥来加密数据响应给对⽅,...

2020-08-28 14:48:56 105

原创 HTTP的keep-alive是⼲什么的?

在早期的HTTP/1.0中,每次http请求都要创建⼀个连接,⽽创建连接的过程需要消耗资源和时间,为了减少资源消耗, 缩短响应时间,就需要重⽤连接。 在后来的HTTP/1.0中以及HTTP/1.1中,引⼊了重⽤连接的机制,就是在http请求头中 加⼊Connection: keep-alive来告诉对⽅这个请求响应完成后不要关闭,下⼀次咱们还⽤这个请求继续交流。协议规定HTTP/1.0如果想要保持⻓连接,需要在请求头中加上Connection: keep-alive。...

2020-08-28 14:43:51 136

公共工具安装指引.pdf

自用文件

2021-05-18

bmp-canvas.js

针对bmp不显示的画布绘制处理方案

2021-03-29

statics.zip

whammy.js 用于web实时播放视频

2021-03-29

读取csv文件url内容 并转html表格显示

读取csv文件url内容 并转html表格显示

2020-07-15

空空如也

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

TA关注的人

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