11 2021 档案
摘要：mockApi 开发过程中，前端开发大多数情况下根本就等不到后端的接口。经常会前后同步开发，后期联调。这样前端进行mockApi来模拟和后端交互就尤为重要了。 安装 mocker-api 因为只在开发环境使用 PS E:\DDD\Vue3CLI\stones7> yarn add -D mocker
阅读全文
摘要：如何在Vue中使用动态CSS 开发过程中，有需要通过script去动态修改css样式中某些属性值，比如 主题切换。 v-bind <style>标记支持使用v-bind 将CSS值链接到组件状态 <template> <div class="text">hello</div> </template>
阅读全文
摘要：浮动 浮动属性产生之初是为了实现“文字环绕”的效果，让文字环绕图片在网页实现类似word中“图文混排”。 如果给元素设置float: left | right 会导致该元素脱离文档流。像设置的方向靠近。 危害 如何父元素没有设置高度，而所有的子元素都设置了浮动，会导致父元素的高度塌陷为0 如何解决
阅读全文
摘要：HTTP的历史 HTTP 建立之初，主要就是为了将超文本标记语言(HTML)文档从Web服务器传送到客户端的浏览器。经过慢慢的发展我们的 HTML 页面有了 CSS，Javascript，后来又出现了ajax。我们可以脱离浏览器从服务端获取数据，再后来又出现了手机端。我们要对HTTP进行深入理解满足
阅读全文
摘要：如何对树结构进行检索，并返回完整路径的树结构 近期有个前端需求，用户想要对树进行检索。 需求详情 要展示所有条件匹配的节点 展示到的节点，若还具有子节点，默认不展开。用户可以继续点击展开查看。 需求分析 找到符合条件的节点，并且 代码示例 以简单的三层结构为示例 const treeData = [
阅读全文
摘要：ESLint介绍 ESLint 是在 ECMAScript/JavaScript 代码中识别和报告模式匹配的工具，它的目标是保证代码的一致性和避免错误。在许多方面，它和 JSLint、JSHint 相似，除了少数的例外： ESLint 使用 Espree 解析 JavaScript。 ESLint
阅读全文
摘要：何为闭包 一个函数和对其周围状态的引用捆绑在一起（或者说函数被引用包围），这样的组合就是闭包（closure）。也就是说，闭包让你可以在一个内层函数中访问到其外层函数的作用域。在 JavaScript 中，每当创建一个函数，闭包就会在函数创建的同时被创建出来。 作用域 function outer
阅读全文
摘要：原型链与继承 原型链 以数组为例，看下面代码 let arr = [1, 2, 3] arr /** (3) [1, 2, 3] 0: 1 1: 2 2: 3 length: 3 [[Prototype]]: Array(0) at: ƒ at() concat: ƒ concat() constr
阅读全文
摘要：从0搭建一个Vue3项目 近期想把自己的知识串起来，想了又想，没有什么比从0搭建一个项目更能考验一个人的基础知识。从生成脚手架，打包，编译，到部署上线。记录下自己遇到的坑以及解决过程。 环境搭建 运行环境 node.js PS E:\makedowm> node -v v14.18.0 Vue CL
阅读全文
摘要：vue2之diff算法 近期一直在复习vue2，记录下比较重要的一环，diff算法。 前面的渲染流程简单的过一下 new Vue({ el: '#app', router, components: { App }, template: '<App/>' }) templete通过语法解析生成AST语
阅读全文
摘要：devdependencies、dependencies、peerDependencies配置详解 要弄清楚package.json中这三项配置下的包名生成的场景就要先弄清楚4个npm命令。 npm install mypack & npm install mypack -save npm inst
阅读全文
摘要：简介 Markdown是一种「标记语言」，通常为程序员群体所用。Markdown的语法十分简单，常用的标记符号不超过十个。下面一一列举，记录给自己参考和学习。 Markdown标题 标题是最常用的格式，在文本前加#即可,#号个数，代表几级标题 最多6级。 例如： # 一级标题 ## 二级标题 ###
阅读全文
摘要：Vue路由中的hash和history模式的区别及原理 众所周知、vue-router 具有hash、history两种路由模式。以Vue3为列 import { createRouter, createWebHistory, createWebHashHistory } from 'vue-rou
阅读全文
摘要：使用了lodash的深拷贝方法 import { cloneDeep } from 'lodash-es' /** * 遍历 tree * @param {object[]} tree * @param {function} cb - 回调函数 * @param {string} children
阅读全文
