前端
关注
分享
扫一扫
前端小白
这个作者很懒，什么都没留下…
展开
-
实现一个通过多次递归串联起来的treeData
实现一个通过多次递归串联起来的treeData原创 2022-09-23 23:31:22 · 393 阅读 · 1 评论 -
vue后台管理整体架构面包屑、tagsView、菜单联动思路
面包屑、tagsView、菜单联动前言整体思路:sideBar左侧菜单与面包屑、tagsView产生联动关系重点在于节点的标识（key，pkey–所有父节点key生成的一个数组）以及父节点的标识（key），所以当从后台拿到数据先要通过递归遍历的方法对数据进行改造。通过点击菜单收集当前菜单数组所有的key组成一个新的数组["1","1.1","1.1.1"]然后再通过递归遍历的方法去找到所有key对应的路由信息并组成一个新的数组[{},{},{}]，然后通过mapstate采集到数据currentR原创 2022-03-14 12:18:28 · 3449 阅读 · 2 评论 -
@antv/g6在ie11报语法错误，兼容处理
错误分析:上图清晰明了指出@antv/g6在es6转es5的时候没全部转换完，ie不识别es6代码，所以要添加一个babel-profill。项目中引入babel-polyfill，安装方法可以自行百度，在这里我直接上命令：npm i --save babel-polyfill第一步：引入babel-polyfill引入babel-polyfill的方式无非有以下几种1.在main.js的顶部直接使用 import ‘babel-polyfill’2.在vue.config.js中，直接在原创 2022-01-05 09:59:56 · 2695 阅读 · 1 评论 -
vue3+nodejs利用RSA加密实现登陆注册
前言现在市面上密码加密方式很多，常用的加密方式比如AES，RSA。还有一些通过散列算法生成摘要的方式，比如md5、sha1等等，我们最常用的是md5，但是md5是不可逆的，而且跟用户的操作习惯有很大的关联，如果密码过于简单很不安全，所以我们能不能用其他的加密方式来生成密文呢？md5剖析在用户登录时需要将密码加密，不能以明文发送。所以就涉及到加密，我们一贯的用法是使用md5加密，但是对于md5网上众说纷纭，说md5加密不安全，容易被暴力破解，首先MD5都不能称之为加密，它是不可逆的，所以本质它是对文件本原创 2021-07-19 20:32:48 · 1768 阅读 · 13 评论 -
pdf.js+Viewer.js 改动源码进阶传参预览PDF附件
现在的浏览器基本都支持直接把pdf文件拖到浏览器就可以打开了，不用安装额外的插件。但是不同的浏览器显示的页面不一样。如果我们想在网页上统一预览pdf怎样实现呢？Mozilla开源了一个插件pdf.js，无需任何本地支持就可以在浏览器上显示pdf文档。唯一的要求就是浏览器必须支持HTML5。使用方法：PDF.js 可以在官网上下载：http://mozilla.github.io/pdf.js/解压到目录pdf，再把整个目录拷贝到网站的public目录下。解压后是这样的：我们可以使用pdf.js自带原创 2021-05-31 11:44:03 · 4350 阅读 · 0 评论 -
使用grid布局分配空间并实现懒加载
举个例子//ul样式 width: 100%; display: grid; grid-template-columns: repeat(5, 1fr);//1fr 平分空间 grid-template-rows: repeat(4, 1fr); grid-column-gap: 20px; grid-row-gap: 20px; margin-bottom: 20px;//img 样式.item-content>ul>li img原创 2021-01-18 14:52:44 · 482 阅读 · 0 评论 -
利用nodejs对接232接口电子秤
先给大家推荐两款工具用来进行端口监测 百度云盘链接 提取码：dj2o 下面介绍一下这两款工具：这款工具你可以理解为电子秤一方，该端口用来将数据手动发送给服务端进行业务处理，服务端将在下面介绍。这款工具 用来检测端口的状态，比如你将电子秤端口命名为COM1，服务端接收端口命名为COM2，先在这个工具中添加这些端口，然后就可以检测这些端口是否开启，如上图所示，我的com1端口是用上述第一个工具打开的，所以路径在桌面，COM2端口是在本地用node开的服务，所以它定位的路径在nodejs目录下。第二步原创 2020-12-02 17:10:06 · 2265 阅读 · 2 评论 -
nodejs使用exceljs批量导出图片到excel并将excel下载到本地
由于img.onload方法不同于其他函数，他是一个事件回调。js是单线程的 他会先按照顺序执行主程序 当主程序执行完成后才会执行事件回调 所以在批量导出图片时onload事件总是最后执行采用了很多办法 ，网上提供的所有解决办法我都试过了，没有能解决的。所以我将解决方法转到后端来实现，但是node.js默认是单线程，一个node.js应用无法利用多核资源，将网络图片转成base64后再利用exceljs库写到excel中单张图片就需要一秒多的时间，所以最终采用定时器来解决，最近比较忙，就不详细阐述了，代原创 2020-11-25 14:20:57 · 2815 阅读 · 2 评论 -
FastClick--解决移动端点击延迟问题
使用npm安装npm install fastclick普通用法<script src="xxx"></script>初始化FastClick实例纯Javascript版if ('addEventListener' in document) { document.addEventListener('DOMContentLoaded', functio...原创 2020-04-02 16:50:32 · 197 阅读 · 0 评论 -
条形码/二维码的生成并打印
JsBarcode生成条形码//js<script src="./js/jquery-1.4.4.min.js"></script><script src="./JsBarcode/JsBarcode.all.min.js"></script> <script>$(function () { var code =...原创 2020-03-24 17:09:55 · 1709 阅读 · 0 评论 -
input点击后placeholder中的提示消息消失离开时显示
两个事件：1.onfocus //聚焦2.onblur //鼠标离开for(var i = 0;i < $("input").length;i++){ var k = $("input").eq(i); var content; k.focus(function(){ content = $(this).attr("placeholder"); $(...原创 2019-11-26 19:08:06 · 603 阅读 · 0 评论 -
利用swiperjs实现导航与tab页的联动
这里主要实现了以下功能：1.点击导航栏切换tab2.tab页高度自适应不会影响布局3.导航栏的拖动4.tab页的滑动与导航栏联动代码如下：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" conte...原创 2019-10-16 18:23:34 · 1666 阅读 · 2 评论 -
nodejs利用babel转换高阶语法
由于nodejs只支持部分es6语法，所以在项目中要通过配置babel来实现es6到es5的转换1.npm init生成npm包2.安装express：npm i express --save3.开启服务器：import express from "express";let app = express();app.get("/",(req,res)=>{ res.e...原创 2019-09-09 18:05:49 · 1052 阅读 · 0 评论 -
WebSocket结合nodejs实现一个简单聊天工具
html代码：<body> <div> <h3>小许聊天工具</h3> <ul class="ul"></ul> <div class="send"> <input type="text" class="text" /> &l...原创 2019-09-07 13:36:54 · 689 阅读 · 0 评论 -
nodejs学习日记文件管道传输实现原理和http模块
管道pipe的实现原理：let fs = require("fs");let rs = fs.createReadStream("C:/Users/23133/Desktop/晓阳.jpg");let ws = fs.createWriteStream(__dirname + "/source1/pipe1.jpg");rs.once("open",()=>{ conso...原创 2019-08-19 17:08:29 · 382 阅读 · 0 评论 -
flex布局时Dom元素宽高均为auto时border引发的布局问题
flex布局时在宽高都为auto时不想因border边框导致布局发生抖动或者改变有以下几种解决方案：1.outline:如果不设置圆角，可以用这种方式，因为outline设置圆角只适用于火狐浏览器，真的是坑！！！outline不同于border，他不会占据位置空间，所以可以很好地解决由于border的1到2个像素引发的布局抖动。使用方法: out-line:1px solid #f40;...原创 2019-08-14 17:03:13 · 779 阅读 · 0 评论 -
nodejs学习日记--Buffer缓冲器以及fs模块
Buffer缓冲器缓冲区Buffer是暂时存放输入输出数据的一段内存，js没有二进制数据类型，而在处理Tcp跟文件流时必须要处理二进制数据，Buffer是专门来处理二进制数据的。 let a = Buffer.alloc(20)//创建一个Buffer内存，他的空间有20位 let b = Buffer.alloc(20,10)//创建一个Buffer内存，他的空间...原创 2019-08-15 18:03:07 · 320 阅读 · 0 评论 -
vue固定组件导航栏样式随着路由的切换而改变以及ele-ui表格的使用
附上github地址:https://github.com/xuchenyang123/vue-nav.git原创 2019-08-21 17:17:31 · 814 阅读 · 0 评论 -
nodejs学习日记fs模块--文件拷贝和目录拷贝
fs模块补充fs.open()–>异步打开文件fs.open(path,flags,mode,callback)path <string> | <Buffer> | <URL>flags <string> | <number> 参阅支持的文件系统标志。默认值: 'r'。mode <integer> 默认值: 0...原创 2019-08-16 20:58:31 · 5901 阅读 · 0 评论 -
nodejs根据地址栏获取后缀名访问文件
let http = require("http");let path = require("path");let url = require("url");let fs = require("fs");http.createServer((req, res) => { let myUrl = url.parse(req.url); let pathName = my...原创 2019-08-26 10:01:20 · 735 阅读 · 0 评论 -
element-ui表格排序
html <el-table ref="singleTable" :data="tableData" highlight-current-row style="width: 100%" size="medium" border @cell-click="transferId" ~~:defaul...原创 2019-08-27 14:37:40 · 1217 阅读 · 0 评论 -
vue公共组件的某部分通过路由的改变显示与隐藏，组件内路由守卫的使用控制两个专属路由之间的数据交互
组件内路由守卫的使用控制两个专属路由之间的数据交互：data() { return { tableData: [], currentRow: null, currentTime: "", loadTime: "" }; }, beforeRouteEnter: (to, from, next) => { if(...原创 2019-08-28 15:45:10 · 2077 阅读 · 0 评论 -
layui学习日记--表格
表格：表格渲染方式：自动渲染，直接拉取接口获取数据，一般成功状态码是200，此处只有成功状态吗为0，才可以成功渲染。代码演示：table.render({ elem: "#test", // id: "table_cell_data", url: "http://localhost:3000/all", toolb...原创 2019-09-02 19:15:18 · 342 阅读 · 0 评论 -
layui表格--根据表格中某一行中的某一列的值来给该行以及该列添加css样式
数据拉取过来之后在回调事件done里根据数据来做个处理：table.render({ elem: "#test", // id: "table_cell_data", url: "http://localhost:3000/all", toolbar: "#toolbarDemo", //指向自定义工具栏模板选择器...原创 2019-09-03 18:38:33 · 9663 阅读 · 3 评论 -
layui学习日记-弹出层
layer.open： layer.open({ type:xxx, content:xxx, offset:xxx, shadeClose:xxx }); 1.type：number类型，默认为0 layer提供了5种层类型。可传入的值有：0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层...原创 2019-09-04 16:11:15 · 387 阅读 · 0 评论 -
nodejs学习日记--请求日志，错误日志中间件
//引入expressconst express = require("express");let app = express();//请求日志中间件//放于get post中间件的最上层router.use(function(req,res,next){ const log = ` -------------------------------------- 1.请求方式:...原创 2019-09-05 18:39:58 · 1074 阅读 · 0 评论 -
nodejs学习日记--nodejs模块导出exports和module.exports的区别
其实exports跟require都只是一个函数的参数，所以并不是全局的属性。具体函数实现方式如下：(function(exports,require,module,__filename,__dirname){exports = module.exports = {};return module.exports;})注意此处导出的是module.exports重点来了：modul...原创 2019-08-13 21:27:06 · 371 阅读 · 0 评论