摘要:
公众号链接:https://mp.weixin.qq.com/s/o0ucrZUfMn2Tu3OydkDx3g 背景 在用户体验越发重要的今天,关注页面性能、提升页面展现速度及交互体验对前端开发越来越重要。 为了监测页面性能,chrome 开发团队就提出过监测网页性能的一些指标,比如 FP、FCP 阅读全文
摘要:
工作用的技术栈主要是React hooks + TypeScript。使用三月有余,其实在单独使用 TypeScript 时没有太多的坑,不过和React结合之后就会复杂很多。本文就来聊一聊TypeScript与React一起使用时经常遇到的一些类型定义的问题。阅读本文前,希望你能有一定的React 阅读全文
摘要:
一、什么是useContext 在 React class 式中父组件向子组件传递参数可以通过 props ,context。但是在函数式组件中需要向多层组件传递数据时,此时就可以使用 useContext/ 二、useContext的作用 1.useContext可以帮助我们跨越组件层级直接传递变 阅读全文
摘要:
Context 是什么?Context 提供了一个无需为每层组件手动添加 props,就能在组件树间进行数据传递的方法。在一个典型的 React 应用中,数据是通过 props 属性自上而下(由父及子)进行传递的,但这种做法对于某些类型的属性而言是极其繁琐的(例如:地区偏好,UI 主题),这些属性是 阅读全文
摘要:
你可能不止一次地听大家讨论性能的话题、一个速度飞快的web 应用是多么重要。 我的网站快吗?当你试图回答这个问题的时候,你会发现快是个很模糊的概念。我们在说快的时候,我们到底指的哪些方面?是在什么场景下?对谁而言? 谈论性能的时候务必要准确,不要使用错误的概念,以免开发人员一直在错误的事情上做优化— 阅读全文
摘要:
一、需求:下拉框支持远程搜索,根据用户输入字符,调接口获取数据渲染到下拉列表上,供用户选择。 二、为什么要做 防抖控制?在做远程搜索时,如果每输入1个字就调用1次接口,就会频繁地掉接口请求数据,假设我们的查询是"12345",不考虑用户输入错误的情况,至少会请求5次。很明显这样频繁地查询数据库是不合 阅读全文
摘要:
const routeUrl = this.$router.resolve({ path: "/targetUrl", query: { id: 96 }, }); window.open(routeUrl.href, "_blank"); <router-link target="_blank" 阅读全文
摘要:
一、介绍allSettled() 在es6推出的Promise实例中,有一个方法叫allSettled()。通过Promise.allSettled()可以接收一个数组,并且在数组里面的所有实例,全部执行完,再通过then方法或者catch方法,对数组里面的实例进行遍历与操作。 (function( 阅读全文
摘要:
chrome、安卓中都可以通过 new Date(‘2021.12.11 00:00’) 或 new Date(‘2021-12-11 00:00’) 转换为正常 Date 对象,在 IOS 中,都会转换为 NaN,IOS 只支持 new Date(‘2021/12/11 00:00’) 格式。而且 阅读全文
摘要:
方式一: data() { return { imgSrc: required(...图片相对路径); } } 方式二: import imgSrc from './img.png'; data() { return { imgSrc, } } 阅读全文