自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(167)
  • 收藏
  • 关注

原创 【LeetCode】-83 给定一个已排序的链表的头 head , 删除所有重复的元素,使每个元素只出现一次 。返回 已排序的链表

【代码】【LeetCode】-83 给定一个已排序的链表的头 head , 删除所有重复的元素,使每个元素只出现一次。返回 已排序的链表。

2023-06-14 17:42:16 132

原创 React生命周期实测

开发阶段组件会渲染两次,是React故意为之。

2022-09-22 09:42:27 422 1

原创 Vue项目读取public下excel文件并解析渲染

Vue项目读取public下excel文件并解析渲染

2022-06-17 11:12:35 1484 2

原创 element ui封装可搜索下拉框(解决数据过多卡顿问题)

element ui封装可搜索下拉框,最多显示30条,解决数据过多卡顿

2022-06-15 15:02:11 801

原创 JS判断密码强度封装

/** * 校验密码强度 * 强度规则: * 1) 任何少于6个字符的组合,弱;任何字符数的同类字符组合,弱; * 2) 不少于6位的两类字符组合,中; * 3) 12位字符数以下的三类或四类字符组合,强; * 4) 12位字符数以上的三类或四类字符组合,非常好。 * @param value * @returns {number} 强度等级 */export const checkPasswordStrong = (value) => { let modes = 0 if

2022-01-19 11:26:23 543 1

原创 Vue+element纯前端封装分页表格

<template> <!-- 纯前端分页表格,只需传tableData --> <el-row> <el-col> <el-table :data=" tableData.slice((currentPage - 1) * pageSize, currentPage * pageSize) " style="width: 100%; padding: 0 1

2022-01-17 16:39:19 563

原创 踩坑知识点记录: http请求自动携带Cookie规则

踩坑源头由于工作中同一个前台项目调用了不同服务的接口,发现发送到其中一个服务器的请求中没有携带token,进而发现问题原因http请求自动携带cookies的条件:本地已经缓存有cookies根据请求的URL来匹配cookies的domain、path属性,如果都符合才会发送。第一条是已经满足了,第二条没有满足。最后不通过cookie来设置token就解决这个问题了...

2021-08-18 18:13:02 3565

原创 Vue封装axios

本文借鉴antd vue pro规范,博主信条:好的规范能很大程度减少bug的产生!request.jsimport axios from 'axios'import Cookie from 'js-cookie'// 跨域认证信息 header 名,根据自己业务自定义const xsrfHeaderName = 'token'axios.defaults.timeout = 5000axios.defaults.withCredentials = trueaxios.defaults.

2021-08-18 18:03:11 331

原创 JavaScript树转列表

封装即用/** * * * @param {*} Tree 将要变成列表的树 * @param {*} childrenName children字段的键名 * @return {*} list * 张志光 2021/8/4 */const treeToList = function (tree, childrenName, list) { tree.forEach(item => { if (!item[childrenName] || item[chi

2021-08-18 17:46:39 651

原创 JS将数组转化为树 (已封装成函数,拿来即用)

/** * listToTree.js * * @param {*} list 将要变成树的列表 * @param {*} id 元素id字段名称 * @param {*} parentId 元素父id名称 * @return {*} tree * 张志光 2021/6/23 */const listToTree = function(list, id, parentId) { let tree = []; tree = list.filter( item1 =&g

2021-06-23 15:04:58 792

原创 Vue登录页手写滑动验证组件

时间有限直接上代码// slider.vue<template> <div> <div class="rect" ref="rect"> <div :class="['slide', isRight ? 'slide-right' : '']" ref="slide"> <a-icon v-show="!isRight" type="right" /> <a-icon v-show=

2021-06-03 14:01:45 322

原创 将定位元素显示到父元素上层

第一种方法给父元素相对定位加上z-index,比子元素小第二种方法父元素设置:overflow: revert;

2021-03-31 09:55:03 847

原创 关闭单个文件eslint的检测

在文件代码顶部添加/* eslint-disable */

2020-11-11 17:32:14 2293

原创 koa2实战个人笔记(二)——模板渲染引擎ejs

配置在app.js中注册(前提是安装)const views = require('koa-views')// 注册模板文件,指定相应文件夹app.use(views(__dirname + '/views', { extension: 'ejs'}))引用直接在路由中使用ctx.render函数,需要注意读取文件是异步操作,要用await。router.get('/', async (ctx, next) => { <!--第一个是模板的文件名,第二个参数对象是传到模

2020-11-10 15:34:36 1062 1

原创 Koa2实战个人笔记(一)

初始化新建src文件夹,将开发文件放入src中(public,routes,views,app.js)路由get传参router.get('/loadMore/:username/:pageIndex',async (ctx,next)=>{ const {username,pageIndex} = ctx.params ctx.body = { title:"this is loadMore api", username, pageIndex }})在

2020-11-10 15:33:53 306

原创 moment常用时间封装(几天前,几周前,几月前,几年前)

封装时间API自己封装了项目中需要用的常用时间,比如当前时间,几天前,几周前等等。一些UI组件比如antd,element等需要用moment对象的日期、时间组件可以直接用。上代码。import moment from 'moment'/** * 获取当前时间 * @returns {moment.Moment} */export const getNowDate = () => { return moment(new Date(), 'YYYY-MM-DD')}/**

2020-11-02 13:59:06 3472

原创 解决AntV G2图表宽高自适应时第一次加载(初始化)宽度略宽问题

问题描述AntV G2图表结合栅格系统,在第一次加载后图表比父盒子略宽(ant design of vue),但刷新后或改变窗口宽度后恢复正常。解决在mounted函数里图表初始化后加上如下代码: mounted () { this.loadingAllChart() // 下面代码解决第一次渲染,图标宽度过款问题 const e = document.createEvent('Event') e.initEvent('resize', true, true)

2020-10-22 16:22:07 3639 1

原创 解决ant design pro of vue表单输入卡顿bug

原因主要因为表单中下拉框加载数据过多,导致表单每次输入重新渲染解决办法在表单属性中加上 :selfUpdate=“true” 即可 <a-form :selfUpdate="true" :label-col="{ span: 5 }" :wrapper-col="{ span: 16 }" :form="prealertHeaderForm">如上,即每次输入只渲染组件本身。...

2020-10-19 12:00:55 2523

原创 ant design pro of vue导航菜单图标引入阿里巴巴矢量库iconfont方法

第一步:去阿里巴巴矢量库生成项目图标。复制以下代码:第二步:打开项目组件中Menu/menu.js.第三步:引入Icon组件并添加以下代码,scriptUrl为你自己项目生成的url.第四步:找到renderIcon函数,新增以下代码:点击保存,就可以支持icon-font了。需要注意的是后台返回的菜单meta.icon中字段要以"icon-"开头,阿里巴巴矢量库中图标也要已’icon-'开头(默认也是以icon-开头的)。与上图代码相对应。如下:然后就可以了,不信你试一下。

2020-10-16 11:16:36 2488 6

原创 NodeJs实战第三章之添加数据库实现增删改查

添加数据库一般步骤选择数据库寻找该数据库在npm上已实现的模块,并安装到项目中创建模型,封装数据库访问API把模型添加到Express路由中选择sqlite3作为数据库优点:不用下载,适合入门下载sqlite3npx yarn add sqlite3封装数据库访问APIArticle.jsconst sqlite3 = require('sqlite3').verbose();const dbname = 'later.sqlite';const db = new sqli

2020-09-28 18:14:10 1097

原创 NodeJs实战第三章之简单实现增删改查接口

具体demo如下:const express = require('express');const bodyParser = require("body-parser")const app = express();const articles = [{title:'这是一篇文章'}]const port = process.env.PORT || 3000;app.use(bodyParser.json()); //支持编码为JSON的请求消息体app.use(bodyParser.ur

2020-09-28 14:30:14 855

原创 NodeJs实战第二章之异步任务的流程控制

异步逻辑的顺序化让一组异步任务顺序执行的概念被称为流程控制。流程控制分为两类:串行和并行串行任务需要一个接一个执行的任务叫做串行任务。使用流程控制工具:Async库 实现串行使用:安装:npm install async使用demo:const async = require('async');async.series([ callback =>{ setTimeout(() => { console.log('frist');

2020-09-27 16:21:47 401

原创 NodeJs实战第二章之异步编程总结

一、异步回调方式最普通的方式,将回调函数当成参数进行回调。const sayHello = ()=>{ console.log('hello')}setTimeout(sayHello, 100);二、事件发射器跟浏览器中给元素添加事件一样。简单使用:const EventEmitter = require('events').EventEmitter;const toSchool = new EventEmitter();toSchool.on("getUp",()=&gt

2020-09-25 15:23:16 174

原创 NodeJs实战第二章之模块系统

一.创建新的Node项目首先创建好文件夹。然后进入文件夹执行:npm init -y参数-y表示yes. npm会因此创建一个全部使用默认值的package.json文件,省去了输入基本配置的步骤。二.模块的使用NodeJs使用common.js进行模块化。exports与requireexports初始为一个空对象,exports对象只能添加属性,不能重新赋值。require的作用是加载exports对象// module01.jsconst sayName = (name) =

2020-09-24 17:37:44 160

原创 NodeJs实战第一章总结

用Node的http模块写Hello World普通实现:const http = require('http')const port = 8088const server = http.createServer((req,res)=>{ res.end(`Hello,world`)});server.listen(port,()=>{ console.log(`Server listening on:http://localhost:%s`,port)})用exp

2020-09-24 15:03:55 140

原创 解决ant design vue树形控件/可展开表格默认展开属性defaultExpandAll/defaultExpandAllRows不生效(采坑日记)

解决办法主要是由于ant-design组件数据是单向流动的,树形控件/表格在第一次渲染时异步加载的数据还未存在。所以用v-if确保数据存在再渲染组件。<a-row class="tree-box"> <a-col> <a-tree v-if="menuListTree.length>0" v-model="checkedKeys"

2020-09-18 15:40:19 7994 1

原创 作用域插槽理解与使用

作用域插槽用于父组件在插槽实例中取到子组件的数据,使用方法如下:在子组件用冒号+属性的方式传递数据,类似于props传递数据。<template> <div class="hello"> <slot :data="age"></slot> </div></template><script>export default { name: "HelloWorld", props: { m

2020-09-17 10:28:36 2176

原创 上海保时达RPX一面总结(半小时左右)

大部分都是基础题首先是常规自我介绍~~~(一分半左右)一.HTML+CSS篇不定宽高的div水平垂直居中有哪几种方式?em/rem的区别?rem如何进行适配不同屏幕?说说H5新特性?说说css3新特性?position的几种属性以及作用?清除浮动的方法?讲一下你理解的BFC?触发BFC的条件?BFC解决的问题?你是如何理解语义化标签的(语义化标签的好处)?css中选择器的权重权重最大的csscss中权重的计算方式二.js篇js的数据类型?书写js的规范有哪些?什

2020-09-14 16:12:30 141

原创 JavaScript实现快速排序

根据快速排序思想:首先找到基准数。遍历数组,比基准数小的放左边,比基准数大的放右边。把左右数分别放在数组里执行1,2步操作,直到左右数组里只有一个数。返回排好序的数组,即左数组+基准数+右数组实现代码:const quickSort = (arr)=>{ //定义一个基准数 let base_num = arr[0]; //定义左数组 let left_arr = []; //定义右数组 let right_arr=[]; //一

2020-08-17 17:29:57 426 2

原创 裁剪图片并将图片上传到到阿里云oss(element-ui上传组件结合图片裁剪插件VueCropper)

摘自本人项目,供自己查阅。如有需求请联系我共同探讨。<template> <div> <headTitle title="行业洞察文章管理" /> <div class="content"> <el-form ref="form" :model="articleData" label-width="80px"> <el-form-item label="文章标题">

2020-06-22 14:00:06 1099

原创 element-ui自定义显示某列

<!-- 表格 --> <el-table :data="tableData" stripe style="width: 100%"> <el-table-column prop="withdrawUser" label="用户昵称" width="100" align="center"></el-table-column> <el-table-column prop="cardType" label="收款方

2020-06-19 17:52:49 2504

原创 element-ui中表格一个单元格中加多行数据

<el-table-column prop="serviceIntroduce" label="服务简介" width="280" align="center"> <!-- 分行显示 --> <template slot-scope="scope"> <div v-for="(item,index) in...

2020-04-25 14:51:04 11161 3

原创 解决浏览器缩放导致页面显示不全问题

问题pc端web页面开发时,发现windows系统经常推荐用户使用125%、150%比例的缩放窗口,这样导致web页面被进行缩放,除此之外还有人为的按钮缩放。故此,在页面devicePixelRatio(设备像素比例)变化后,通过计算页面body标签zoom修改其大小,来抵消devicePixelRatio带来的变化。解决所用JS/** * @author trsoliu * @date...

2020-04-16 22:51:54 17725 5

原创 解决微信小程序Scroll-view组件flex布局不生效

解决项目中碰到的一个问题:Scroll-view组件flex布局不生效解决办法:设置scroll-view组件的enable-flex<scroll-view scroll-x="true" class="category" enable-flex="true"> <view wx:for="{{categoryData}}" wx:key="{{index}}"...

2020-03-23 09:21:24 5230

原创 用JS取出后台返回数据中用标签样式包裹的内容

后台返回的数据是这样的: `<p><span style="color: rgb(51, 51, 51); font-family: &quot;Open Sans&quot;, sans-serif; font-size: 12px; font-style: normal; font-variant-ligatures: normal; font-vari...

2020-03-20 11:23:56 2015 1

原创 CSS技巧记录

有幸见到一个好用又省时的css技巧,赶忙打开csdn记录下来。:empty用css代替js做的事。假如有一个输入框,搜索之后发现后台返回的数据为空,此时需要往搜索结果处写入"搜索结果为空!"字样。现在可以这样解决:box:empty::before{ content: '没有搜索结果'; display: block;}只要搜索结果为空,盒box为空,就会自动填充"...

2020-03-16 10:25:22 144

原创 leetCode——204.计数质数(javascript)

题目描述:统计所有小于非负整数 n 的质数的数量。解法:const countPrimes = function (n) { if (n === 1 || n === 2) { return 0; } let count = 0; for (let m = 2; m < n; m++) { let flag = true;...

2020-03-16 09:58:51 231

转载 解决浏览器因滚动条出现抖动的问题

html { overflow-y: scroll;}:root { overflow-y: auto; overflow-x: hidden;}:root body { position: absolute;}body { width: 100vw; overflow: hidden;}

2020-01-15 11:30:25 2515

原创 TypeScript之元组与泛型理解

元组基础元组跟数组的区别在于元组可以存储不同类型的元素et tom:[string,number];tom = ["name",18];tom.push(18);tom.push(18);console.log(tom);// tom.push(true); //报错tom[3] = 10 //报错,只能赋值tom[0],tom[1];注意:数组中的数据类型赋...

2020-01-03 17:16:08 748

原创 TypeScript之内置对象和type关键字

TypeScript中的内置对象说明:JavaScript 中有很多内置对象,它们可以直接在 TypeScript 中当做定义好了的类型。使用时可以直接定义指定相应的类型,常用例子如下let flag:Boolean = new Boolean("1");let err:Error = new Error("错误");let date:Date = new Date("2001-11...

2020-01-02 17:22:57 7534

解决Antd vue下拉框卡顿问题

封装好的组件,下载即用

2022-10-17

空空如也

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

TA关注的人

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