Live2D

08 2021 档案

React学习笔记(九) forwardRef和useImperativeHandle
摘要：forwardRef ref 是为了获取某个节点的实例，但是函数式组件（PureComponent）是没有实例的，不存在 this 的，这种时候是拿不到函数式组件的 ref 的。为了解决这个问题，由此引入 React.forwardRef， React.forwardRef 允许某些组件接收 ref 阅读全文
posted @ 2021-08-24 17:45 吃完夜宵再睡觉 阅读(768) 评论(0) 推荐(0)
React学习笔记(八) userRef
摘要：相信有过React使用经验的人对ref都会熟悉，它可以用来获取组件实例对象或者是DOM对象。 而useRef这个hooks函数，除了传统的用法之外，它还可以“跨渲染周期”保存数据。 在一个组件中有什么东西可以跨渲染周期，也就是在组件被多次渲染之后依旧不变的属性？第一个想到的应该是state。没错，一 阅读全文
posted @ 2021-08-24 16:40 吃完夜宵再睡觉 阅读(418) 评论(1) 推荐(0)
React学习笔记(七) React 性能优化，PureComponent、memo等以及函数组件
摘要：不同类型业务要求的性能标准各不相同。如果对一个 ToB 的后台管理系统要求首屏速度以及 SEO，显然不合理也没必要。 第一要考虑的不是如何去优化，而是值不值得去优化，React 性能已经足够优秀，毕竟“过早优化是魔鬼”，情况总是“可以，但没必要”。 作为一个开发人员，深入了解工具不足之处，并拥有对其 阅读全文
posted @ 2021-08-24 16:23 吃完夜宵再睡觉 阅读(409) 评论(0) 推荐(0)
React学习笔记(六) bindActionCreators
摘要：bindActionCreators是redux的一个API，作用是将单个或多个ActionCreator转化为dispatch(action)的函数集合形式。 开发者不用再手动dispatch(actionCreator(type))，而是可以直接调用方法。 目的就是简化书写，减轻开发负担。 例如 阅读全文
posted @ 2021-08-23 21:29 吃完夜宵再睡觉 阅读(52) 评论(0) 推荐(0)
React学习笔记(六) Redux
摘要：react组件中的通信 react推崇的是单向数据流，自上而下进行数据的传递，但是由下而上或者不在一条数据流上的组件之间的通信就会变的复杂。解决通信问题的方法很多，如果只是父子级关系，父级可以将一个回调函数当作属性传递给子级，子级可以直接调用函数从而和父级通信。 组件层级嵌套到比较深，可以使用上下文 阅读全文
posted @ 2021-08-22 22:51 吃完夜宵再睡觉 阅读(204) 评论(0) 推荐(0)
React学习笔记(五) Portal
摘要：1、用法 普通的组件，子组件的元素将挂载到父组件的DOM节点中。 render() { // React 挂载一个div节点，并将子元素渲染在节点中 return ( <div> {this.props.children} </div> ); } 有时需要将元素渲染到DOM中的不同位置上去，这是就用 阅读全文
posted @ 2021-08-19 17:05 吃完夜宵再睡觉 阅读(170) 评论(0) 推荐(0)
React学习笔记(四) 高阶组件
摘要：Higher-Order Components就是一个函数，传给它一个组件，它返回一个新的组件。 import React from 'react' // 返回一个组件的函数，称之为高阶组件 const titleHoc = (title) => { return Comp => { return 阅读全文
posted @ 2021-08-19 16:58 吃完夜宵再睡觉 阅读(41) 评论(0) 推荐(0)
React学习笔记(三) Context(上下文)
摘要：1.Context Context 通过组件树提供了一个传递数据的方法，从而避免了在每一个层级手动的传递 props 属性。 有部分小伙伴应该使用props属性进行组件向下传值的操作。当多个组件嵌套时候。你就需要慢慢向上寻找最初的值是什么 2.API (个人大白话理解) context api给出三 阅读全文
posted @ 2021-08-19 16:37 吃完夜宵再睡觉 阅读(115) 评论(0) 推荐(0)
React学习笔记 实现简单的todoList
摘要：一个简易的todoList,没有写样式，只是实现了功能. index.jsx import React, { Component, Fragment } from 'react' import List from './list' import Form from './form' export d 阅读全文
posted @ 2021-08-19 15:49 吃完夜宵再睡觉 阅读(92) 评论(0) 推荐(1)
React学习笔记 (二) 状态提升
摘要：为什么有状态提升 因为有单向数据流，我们知道，在 React 中，每个组件只关心它内部的状态，甚至组件无法知道自己是函数组件还是 class 组件。所以我们的 state 为一个局部量，或者说是被封装起来的，它只对这个组件内部是有效的，在组件外面或者其他组件中不能直接使用这个组件的 state。 什 阅读全文
posted @ 2021-08-17 19:34 吃完夜宵再睡觉 阅读(98) 评论(0) 推荐(0)
React学习笔记(一)
摘要：一、create-react-app 全局安装create-react-app $ npm install -g create-react-app 创建一个项目 $ create-react-app your-app 注意命名方式 Creating a new React app in /dir/y 阅读全文
posted @ 2021-08-17 17:49 吃完夜宵再睡觉 阅读(88) 评论(0) 推荐(0)
浏览器缓存
摘要：说白了就是利用本地存储，把一部分数据保存在客户端，减少对服务器的请求，降低服务器压力，提升网页加载速度， 作为一名前端工作人员，前端的缓存知识是必须掌握的，因为一个网站打开网页的速度直接关系到用户体验，用户粘度，而提高网页的打开速度有很多方面需要优化，其中比较重要的一点就是利用好缓存，缓存文件可以重 阅读全文
posted @ 2021-08-11 17:57 吃完夜宵再睡觉 阅读(191) 评论(0) 推荐(0)
【原】雅虎前端优化的35条军规
摘要：内容部分 1.尽量减少HTTP请求数 80%的终端用户响应时间都花在了前端上，其中大部分时间都在下载页面上的各种组件：图片，样式表，脚本，Flash等等。减少组件数必然能够减少页面提交的HTTP请求数。这是让页面更快的关键。 减少页面组件数的一种方式是简化页面设计。但有没有一种方法可以在构建复杂的页 阅读全文
posted @ 2021-08-11 15:58 吃完夜宵再睡觉 阅读(39) 评论(0) 推荐(0)
网站前端和后台性能优化的34条建议
摘要：1 减少HTTP请求数量 (Minimize HTTP Requests) tag:content 80%的用户响应时间被花费在前端，而这其中的绝大多数时间是用于下载页面中的图片、样式表、脚本以及Flash这些组件。减少这些组件的数量就可以减少展示页面所需的请求数，而这是提高网页响应速度的关键。 朴 阅读全文
posted @ 2021-08-11 15:51 吃完夜宵再睡觉 阅读(364) 评论(0) 推荐(0)