wnsry-CSDN博客

原创 js 多维数组对象扁平化数组

js 多维数组对象扁平化数组。

2022-11-15 14:33:13 440 1

<el-table-column label="AAA" align="center"> <template slot-scope="scope"> <el-switch v-model="scope.row.isRecommendTwo" active-color="#52C4CD" @change="handelUpdate(scope.$index, scope.row)" inactive-colo

2022-03-30 18:06:52 1185

原创 js遍历树状数组的方法

var root = { name:'D盘', children:[ { name:'学习', children:[ { name:'电子书', children:[ { name:'文学', children:[ { name:'茶馆'

2022-03-29 16:20:25 1422

原创 git实战操作创建与合并分支

首先，我们创建dev分支，然后切换到dev分支git checkout -b devgit checkout命令加上-b参数表示创建并切换，相当于以下两条命令git branch devgit checkout dev然后，用git branch命令查看当前分支* dev master用git branch -a命令查看本地跟远程的所有分支* dev master 。。。然后，我们就可以在dev分支上正常开发，比如对aaa.js做个修改，然后提交git add aaa

2022-03-04 16:23:29 241

原创 JS数组元素的重新组合（两两组合，三三组合........）

var context = 'a,b,c,d,e,f,g'var contexts= context.split(',')for (var a = []; a.push([]) < contexts.length;) ;var b = Math.pow(2, contexts.length) - 1for (var i = 1; i <= b; i++) { undefined var c = [] for (var s = i, k = 0; s > 0; s &g

2022-03-04 14:33:31 1516

原创理解和使用Promise.all、Promise.race和Promise.allSettled

一、Pomise.all的使用Promise.all可以将多个Promise实例包装成一个新的Promise实例。同时，成功和失败的返回值是不同的，成功的时候返回的是一个结果数组，而失败的时候则返回最先被reject失败状态的值。let p1 = new Promise((resolve, reject) => { resolve('成功了')})let p2 = new Promise((resolve, reject) => { resolve('success')})

2022-03-03 18:04:29 186

原创 CSS实现高斯模糊效果：filter、backdrop-filter

高斯模糊是一种常见的效果（俗称毛玻璃效果），在CSS中使用filter、backdrop属性均可实现。一、filter这其实是一种“假”模糊，需要一层做背景并使用filter属性达到模糊效果，另一层（在背景层之上）设置一个半透明的背景色background: rgba(255,255,255,0.2);filter: blur(20px);二、backdrop-filter这个属性可以让你为一个元素后面区域添加图形效果（如模糊或颜色偏移）。因为它适用于元素背后的所有元素，为了看到效果，必

2022-02-24 16:55:30 1551

原创 css瀑布流的布局

在父容器的column-count: 4; //想要分割的列数column-gap: 10%; //每列的边距和在子容器的break-inside: avoid; // auto 指定既不强制也不禁止元素内的页/列中断。 // avoid 指定避免元素内的分页符。 // avoid-page 指定避免元素内的分页符。 // avoid-column 指定避免元素内的列中断。 // avoid-region 指定避免元素内的区域中...

2022-02-24 16:48:15 105

原创基于element二次封装upload组件，支持上传视频文件

<template> <div class="main"> <div v-for="(item,ind) in ImageUrl" :key="ind" class="list"> <video v-if="isDV(item)" name="upfile" :src="item" class="avatar" controls="controls">您的浏览器不支持视频播放</video> <img v-

2022-02-18 17:16:23 379

原创 js两个对象赋值，只把相同key的值赋到另一个对象

let obj1 = { a: 1, b: 2, c: 3 } let obj2 = { a: 0, b: 0, c: 0 } // 两个对象的字段完全相同时采用下面两种方式 obj2 = Object.assign(obj1) obj2 = obj1let obj3 = { a: 1, b: 2, c: 3, d: 4 } let obj4 = { a: 0, b: 0, c: 0 } // 两个对象的

2022-02-16 14:45:43 4926

原创 new Date().getTime() 多8小时问题

如果new Date() 传入参数为yyyy-MM-dd 且天数补全了0时，会自动加上8小时。而传入格式为 yyyy/MM/dd 时不会自动加上8小时。手动减 8 * 3600 * 1000

2022-02-15 16:05:15 1413

原创 vscode编译器settings.json配置，eslint格式化配置

{ "workbench.iconTheme": "vscode-icons", //路径自动补齐 "path-autocomplete.pathMappings": { "@": "${folder}/src/", "@views": "${folder}/src/views/", }, "git.ignoreMissingGitWarning": true, "vetur.validation.script": false,

2022-02-15 13:29:04 961

原创组件的通信 1：provide / inject

上一节中我们说到，ref 和 $parent / $children 在跨级通信时是有弊端的。当组件 A 和组件 B 中间隔了数代（甚至不确定具体级别）时，以往会借助 Vuex 或 Bus 这样的解决方案，不得不引入三方库来支持。本小节则介绍一种无依赖的组件通信方法：Vue.js 内置的 provide / inject 接口。什么是 provide / injectprovide / inject 是 Vue.js 2.2.0 版本后新增的 API，在文档中这样介绍：cn.vuejs.org/v2

2020-09-02 11:38:46 261

原创 websocket心跳重连（避免断网、服务器重启等）

背景websocket链接，为实现断网、服务器重启等特殊情况。原理每隔一段时间向服务器发送一次数据即（heartCheck.start()），服务器接收数据后返回一次信息，用来证明一切正常，否则就开始启动新的定时器来尝试重新连接（websocketReconnect()一定的时间尝试重连，如此重复）。代码var lockReconnect = false;//避免重复连接var wsUrl = "wss://echo.websocket.org"; // websocket链接var ws

2020-08-27 15:40:57 1401

wnsry的博客