小易不止于搬砖的博客

原创 Vue 自定义指令

本文从为什么要使用自定义指令、到自定义指令的注册、钩子及参数、以及常用指令的实现几方面进行总结

原创 你真的会用extends吗？

通过对比Dart和Vue中的extends、mixin、implement，加深对继承和组合的理解

原创 Vue深入浅出之-变化侦测、虚拟DOM、模板编译

本篇主要基于《深入浅出Vue.js》一书，前三篇：变化侦测、虚拟DOM、模板编译，进行总结。

原创 n、nvm、nrm、pnpm、yarn各种指令大全

一文记录n、nvm、nrm、pnpm 各种指令、环境变量配置，简介等

原创 Vue keep-alive 深度使用解读

keep-alive的使用方法、业务场景、以及原理

原创 前端内存空间(堆、栈、队列、拷贝、垃圾回收）

本文主要介绍：堆、栈、队列，基本数据类型、引用数据类型、深拷贝浅拷贝、垃圾回收机制

原创 WEB转Flutter基础学习笔记（内含vue和flutter对比）

笔者是一名web前端，记录在转栈flutter时的学习笔记，内涵和vue的对比，能够辅助前端同学更容易理解flutter

原创 Java基础知识笔记

java基础

原创 自定义删除无依赖文件的webpack插件

通过自定义webpack插件，利用执行完成编译的封存阶段后，产生的产物module.fileDependencies，生成依赖的文件组。通过读文件的方式，将待扫描的文件组和有依赖关系的文件进行对比。最终暴露出项目中，不存在依赖关系的文件，并可配置将其全部删除。

原创 前端对浏览器的理解

本文包含浏览器的大部分知识，涉及面广泛。涵盖浏览器构成、内核、渲染原理、缓存、安全问题、进程线程、事件模型、事件循环、版本检测等模块以及其具体细节。

原创 forEach/map中使用await报错或没有拿到实际的返回参数解决方法

场景解释：遍历一个数组，将数组的每一项作为入参调用接口，再将返回值拼接push到新数组中，此时，使用Promise.all 等待所有接口返回后 形成一个新数组。

原创 前端常用utils方法持续更新中

常用utils方法，总结沉淀

原创 vue数据更新table内容不更新解决方法

2、为table绑定一个key，数据变化时更改key值,或者使用v-if绑定一个不重复的值触发组件渲染。table组件绑定的数据变化时，页面没有重新渲染，常见于子组件中使用table组件。创建实例时 数组在vue中没有被监听到，属于非响应式数据，数组的下标变化无法监听到。1、利用vue中重写的数组方法。3、使用$set()

原创 vue常见日期库的差异以及使用方法

注意： 24h制时 HH:MM:ss 其中 M大写，s小写 否则不准确 日期大写：yyyy-mm-dd。注意： 24h制时 HH:mm:ss 其中 m，s小写 否则不准确 日期大写：YYYY-MM-DD。注意： 24h制时 HH:mm:ss 其中 m，s小写 否则不准确 日期大写：YYYY-MM-DD。日期库格式化大小写引发的惨案 format(“YYYY-MM-DD HH:mm:ss”)

原创 JS二维数组转化为对象

New Map 将会是无重复的数据，重复key取后一个。

原创 vue2升vue3差异点学习指南

vue3的学习成本如何？习惯使用vue2的开发如何平滑转vue3？

原创 浏览器系列之 Cookie 和 SameSite 属性

Cookie 的设置、属性

原创 查看、关闭端口命令

查看端口、关闭端口命令

原创 antv G6在vue项目中的实践总结

antvG6树图 自定义节点、边；数据更新后重新渲染以及tooltip的使用

原创 el-select el-option中使用搜索图标清空时图标消失解决

el-select el-option中使用搜索图标清空时图标消失解决方案

原创 el-select、el-option添加图标，搜索选项高亮

el-select、el-option添加图标，搜索选项高亮。

原创 el-form的resetFields()坑点

el-form的resetFields()坑点之未清空数组

原创 在此系统上禁止运行脚本。有关详细信息，请参阅 https:/go.microsoft.com/fwlink/?LinkID=135170 中的 about_Execution_Policies。

在全局npm后的依赖可以正常使用，但是在项目中使用会出现如下问题pnpm无法加载文件

原创 axios设置请求头

axios设置请求头方式

原创 vue中key 值的作用

官方文档解释：key 的特殊 attribute 主要用在 Vue 的虚拟 DOM 算法，在新旧 nodes 对比时辨识 VNodes。如果不使用key，Vue 会使用一种最大限度减少动态元素并且尽可能的尝试就地修改/复用相同类型元素的算法。而使用 key 时，它会基于 key的变化重新排列元素顺序，并且会移除 key 不存在的元素。有相同父元素的子元素必须有独特的 key。重复的 key 会造成渲染错误。v-if 中使用 key由于 Vue 会尽可能高效地渲染元素，通常会复用已有元素而不是

原创 前端模块化：AMD&CMD&commonJS&ES6

AMD实现: require.jsAMD 是异步加载模块，可以指定回调函数使用方法就是通过一个全局函数 define，把代码定义为模块，再用 require 方法加载模块遵循依赖前置原则，需要把模块需要的依赖都提前在依赖数组里声明CMD实现:sea.js懒加载: 不需要在定义模块的时候声明依赖，可以在模块执行时动态加载依赖同时支持同步和异步加载模块遵循依赖就近原则CommonJs动态引入对模块是拷贝，修改原来模块的值不会影响引用的值

原创 手写前端常用算法

判断对象属性var uniqueObject = function(arr) { var v, r = [], o = {}; for(var i = 0; (v = arr[i]) !== undefined; i++) { !o[v] && (r.push(v), o[v] = true); } return r;};数组过滤重复项filtervar uniqueFilter = function(arr) { retur

原创 Typescript快速上手（js转ts必备）

接口interface1、定义一个接口LabelledValue ，在传参数的时候使用labelledObj：LabelledValueinterface LabelledValue { label: string;}function printLabel(labelledObj: LabelledValue) { console.log(labelledObj.label);}2、？： 可选属性interface SquareConfig { color?: string;

原创 样式污染引发的思考：scoped原理

1、用法scoped是实现组件的私有化，不对全局造成样式污染，表示当前style属性只属于当前模块。（事实上， scoped是一个boolean值）2、原理（postcss）给HTML的DOM节点加一个不重复data属性(形如：data-v-2311c06a)来表示他的唯一性<style scoped lang="less"> .example{ color:red; }</style><template> <

原创 Arguments 对象

定义：arguments对象是所有（非箭头）函数中都可用的局部变量，我们可以用arguments[0]的形式取值类数组：arguments对象不是一个 Array 。它类似于Array，但除了length属性和索引元素之外没有任何Array属性。转化为数组var args = Array.prototype.slice.call(arguments);// 利用空数组上继承的原型方法var args = [].slice.call(arguments);// ES2015const ar

原创 vue响应式，数据劫持&发布订阅实现

vue数据双向绑定原理：数据劫持: vue.js 则是采用数据劫持结合发布者-订阅者模式的方式，通过Object.defineProperty()来劫持各个属性的setter，getter，在数据变动时发布消息给订阅者，触发相应的监听回调。observer：每个对象的属性，添加到订阅者容器Dependency(Dep)中，当数据发生变化的时候发出notice通知。Watcher：某个属性数据的监听者/订阅者，一旦数据有变化，它会通知指令(directive)重新编译模板并渲染UIDep对象: 订阅

原创 TCP与UDP区别

原创 tcp三次握手、四次挥手过程

三次握手第一次握手：客户端给服务端发一个 SYN 报文，SYN=1，初始序号seq=x。此时客户端处于 SYN_SEND 状态第二次握手：服务器收到客户端的 SYN 报文之后，会以自己的 SYN 报文作为应答，SYN=1，ACK=1，确认号ack=x+1，初始序号seq=y。此时服务器处于 SYN_RCVD 的状态。第三次握手：客户端收到 SYN 报文之后，会发送一个 ACK=1 的报文，确认号ack=y+1表示已经收到了服务端的 SYN 报文。此时客户端处于 ESTABLISHED

原创 浅拷贝与深拷贝的原理、实现、区别

浅拷贝创建一个新对象，这个对象有着原始对象属性值的一份精确拷贝。如果属性是基本类型，拷贝的就是基本类型的值，如果属性是引用类型，拷贝的就是内存地址 ，如果其中一个对象改变了这个地址，就会影响到另一个对象。深拷贝将一个对象从内存中完整的拷贝一份出来,从堆内存中开辟一个新的区域存放新对象,且修改新对象不会影响原对象浅拷贝实现function clone(target){ let cloneTarget = {}; for(const key in target){ cl

原创 element-ui popconfirm的回调函数使用

popconfirm的回调函数使用elementui: popconfirm <el-popconfirm confirm-button-text="好的" cancel-button-text="不用了" icon="el-icon-info" icon-color="red" title="这是一段内容确定删除吗？" @confirm="handlec

原创 npm源切换、管理nrm

npm查看源：npm config get registry永久切换源、设置源npm config set registry https://xxxxxxxx临时使用源npm i xx --registry https://xxxxxxx查看全局安装的包npm list -g --depth 0安装指定版本/最新版本npm i <module name>@1.0.0 //安装指定版本的模块npm i <module nam

原创 reduce 怎么用？原理与使用合集

reduce使用完全指北

原创 git stash 切换分支时不想提交又不想丢失更改

git - 拉取远程代码并且不覆盖本地修改的代码1、先将本地代码放到暂存区`git stash`2、将远程github（码云等）上面的代码拉取下来git pull 3、将第一步暂存区的代码放回本地git stash pop 4、下面继续我们平时的正常上传代码的操作即可：git add . 或者 git add -Agit commit -m '操作内容'git pushgit stash妙用以及原理1、stash当前修改git stash会把所有未提交的修改（包括暂存的

原创 Export2Excel插件导出表格内容转为excel文件

我们需要引入XLSX、file-saver两个插件再定义一个文件路径：vendor/并把Export2Excel.js文件放在此目录下 代码如下/* eslint-disable */import { saveAs } from 'file-saver'import XLSX from 'xlsx'function generateArray(table) { var out = []; var rows = table.querySelectorAll('tr'); var ra

原创 vuex-module-decorators食用方法

vuex-module-decorators