- 博客(238)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 link与@import引入CSS的区别及FOUC
FOUC(Flash of Unstyled Content):用户定义样式表加载之前浏览器使用默认样式显示文档，用户样式加载渲染之后再重新显示文档，造成页面闪烁，在网速较慢或过多使用@import时出现，影响用户体验。link标签优于@import方法。
2023-03-29 22:19:18
582
原创 vue实现支持v-model的component
一个组件上的v-model默认会利用名为value的 prop和名为input的事件，但是像单选框、复选框等类型的输入控件可能会将valueattribute用于不同的目的。model选项可以用来避免这样的冲突
2022-11-23 14:37:05
638
1
原创 前端渲染优化思路
前端模板 JS+数据，减少由于HTML标签导致的带宽浪费，前端用变量保存AJAX请求结果，每次操作本地变量，不用请求，减少请求次数。对于一些小图标，可以使用base64位编码，以减少网络请求。但不建议大图使用，比较耗费CPU。用innerHTML代替DOM操作，减少DOM操作次数，优化javascript性能。对普通的网站有一个统一的思路，就是尽量向前端优化、减少数据库操作、减少磁盘IO。图片预加载，将样式表放在顶部，将脚本放在底部 加上时间戳。网页gzip，CDN托管，data缓存 ，图片服务器。
2022-10-24 13:50:45
498
原创 路由query和params参数的区别
接收参数的形式不一样，分别为和query支持path和name两种形式，params仅支持name形式生成url的格式不同，query产生的url带问号且包含参数的key和value，params仅携带参数的value使用params需要将路由设置为的形式。
2022-09-22 16:12:14
588
原创 js实现数组扁平化的五种方法
扩展运算符是ES6的新特性之一，用它操作数组可以直接展开数组的第一层，利用这个特性，我们可以不使用递归来实现数组的展平，这是因为每一次递归都是对当前层次数组的一次展开，而扩展操作符就是干这工作的。方法会按照一个可指定的深度递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。
2022-09-19 21:01:46
711
原创 详解react生命周期和在父子组件中的执行顺序
挂载阶段 ：组件实例被创建和插入 DOM 树的过程更新阶段 ：组件被重新渲染的过程卸载阶段 ：组件从 DOM 树中被删除的过程下文分别从上述三个阶段解读react的生命周期。
2022-09-03 12:04:20
3775
原创 redux入门详解
redux是一个专门用于做状态管理的js库它可以用于原生js，react，vue，angular等项目中，但基本与react配合使用作用：集中式管理react应用中多个组件共享的状态。
2022-08-31 17:17:05
618
原创 10分钟读懂数据vue响应式和双向绑定原理
数据响应式和双向绑定的主要区别在于：数据响应式是数据驱动视图更新，双向绑定是数据和视图相互驱动更新。
2022-08-18 14:18:44
2249
原创 浅谈路由懒加载的实现与原理
当打包构建应用时，JavaScript包会变得非常大，影响页面加载。如果我们能把不同路由对应的组件分割成不同的代码块，然后当路由被访问的时候才加载对应组件，这样就更加高效了。
2022-08-11 00:00:31
2303
原创 async-pool实现控制并发请求
假设有6个待办任务要执行，而我们希望限制同时执行的任务个数，即最多只有2个任务能同时执行。当正在执行任务列表中的任何1个任务完成后，程序会自动从待办任务列表中获取新的待办任务并把该任务添加到正在执行任务列表中。...
2022-08-10 22:40:14
1584
原创 vue启动报错: 【Error: listen EADDRINUSE: address already in use :::8099】
启动服务的地址端口已被占用，需要kill目标进程。
2022-07-27 10:47:15
570
原创 谈谈DOM0，DOM1，DOM2，DOM3
在W3C协会制定的DOM标准中，DOM标准可以分为DOM1，DOM2，DOM3三个版本。事实上，DOM0级标准是不存在的，所谓DOM0只是DOM历史坐标中的一个参照点。
2022-07-25 19:00:30
3263
原创 Promise知识点拾遗
本文大部分内容来自阮一峰所著ES6入门教程，原文链接在文尾。本文权为个人整理的简洁版。对象的状态不受外界影响。 Promise有三种状态，（进行中）、（已完成，又称fulfilled）和（已失败）。只有异步操作的结果，可以决定当前是哪一种状态，任何其他操作都无法改变这个状态。一旦状态改变，就不会再变，任何时候都可以得到这个结果。 Promise对象的状态只可能有两种改变可能：从变为或者从变为。只要这两种情况发生，状态就不会再变了。Promise对象是一个构造函数，用来生成Prom...
2022-06-27 19:49:40
239
原创 详解为什么v-if和v-for不能同时使用
在Vue官方文档中，明确说明了。因为两者作用在同一个元素时，优先级是不同的。在Vue2中，v-for的优先级是高于v-if的，如果作用在同一元素上，输出的渲染函数中可以看除会先执行循环再判断条件，哪怕只渲染列表中一小部分元素，也得在每次重渲染的时候遍历整个列表，这会造成性能的浪费而在Vue3中，v-if的优先级时高于v-for的，因此v-if执行时要调用的变量可能还不存在，会导致报错。通常有两种情况导致需要v-if和v-for同时使用：为了过滤列表中的项目，例如 。此时可以定义出一个计算属性，例如，让其返回
2022-06-19 22:56:12
9672
原创 HTTP请求头中Referer的作用
RefererHTTP请求中，Referer是header的一部分，当浏览器向web服务器发送请求的时候，一般会带上Referer，告诉服务器该网页是从哪个页面链接过来的，服务器因此可以获得一些信息用于处理。例如，在www.google.com 里有一个www.baidu.com 链接，那么点击这个www.baidu.com ，它的header 信息里就有： Referer=http://www.google.com作用1.防盗链只允许我本身的网站访问本身的图片服务器，假如域名是www.goog
2022-05-26 15:18:28
8297
原创 JS数组去重的几种方式
let arr = [1,1,"1","1",true,true,"true",{},{},"{}",null,null,undefined,undefined]// 方法1let uniqueOne = Array.from(new Set(arr)) console.log(uniqueOne)// 方法2let uniqueTwo = arr => { let map = new Map(); //或者用空对象 let obj = {} 利用对象属性不能重复得特性 l
2022-05-20 13:47:45
198
原创 如何对axios二次封装
步骤引入axios创建axios实例设置请求拦截器（request interceptors）设置响应拦截器（response interceptors）暴露出去具体代码//1. 先引入axios依赖包import axios from "axios"; //2. axios创建对象const Server = axios.create({ baseURL: "", //管理后台要使用的接口的基地址 withCredentials: true, //请求跨域时携带c
2022-05-15 21:44:30
268
原创 浅谈async,await
asyncasync函数返回一个 Promise对象，可以使用then方法添加回调函数。只要使用async，不管函数内部返回的是不是Promise对象，都会被包装成Promise对象。// async基础语法async function fun0(){ console.log(1); return 1;}fun0().then(val=>{ console.log(val) // 1,1})async function fun1(){ console.
2022-05-15 21:18:32
315
空空如也
RTOS使用cJSON内存泄露问题
2021-08-09
TA创建的收藏夹 TA关注的收藏夹
TA关注的人