React
showhand_m
这个作者很懒,什么都没留下…
展开
-
React 常见面试题
hooks 和 class 的区别 // hoos 更容易复用代码,代码量更少 // hooks 响应式的 useEffect,如果依赖不正确,会被意外的触发 // hooks 状态不同步,由于是闭包,所以有异步操作的时候,经常会碰到异步回调的变量引用是之前的 // 复杂逻辑使用class,后期更容易维护 import React, { useState, useRef, useEffect } from "react"; import React, { useState } from "react";原创 2021-01-30 10:58:25 · 89 阅读 · 0 评论 -
虚拟DOM 和 diff 算法的简单理解
为何必须引用React JSX是React.createElement(component, props, …children)方法的语法糖。 自定义的React组件为何必须大写 如果是小写的话就会被当做一个字符串传入 <app>APP</app> => React.createElement('app',null,'APP') <APP>APP</APP> => React.createElement(APP,null,'APP') ..原创 2021-01-18 16:07:10 · 173 阅读 · 0 评论 -
在React 中如何做到拦截用户操作
在React 中如何做到拦截用户操作 用户刷新,关闭当前tab页,关闭浏览器触发以下事件 需要注意的是,这个事件监听,需要用户在浏览器有操作,否则不会生效 useEffect(() => { const listener = (ev: any) => { ev.preventDefault(); ev.returnValue = '离开咯'; }; window.addEventListener('beforeunload', listener)原创 2021-01-13 14:39:06 · 534 阅读 · 0 评论 -
redux react-redux redux-saga redux-thunk dva
redux 为什么出现:React 有 props 和 state ,React 没有数据向上回溯的能力,唯一的方法是提升state到公用组件当中,子组件触发父组件的回调修改state。为了更好的管理state状态,引入了专业的React顶层state分发给所有React 应用 三大原则: 单一数据源: 整个应用的state存储在一棵 object tree 中,并且这个object tree 只存在于唯一一个store中 state是只读的:唯一改变state的就是action, 使用纯函数来执行修改:原创 2021-01-05 10:04:44 · 141 阅读 · 0 评论 -
useReducer 和 useContext的简单应用
context.js import React, { createContext, useContext, useReducer } from 'react'; // 引入默认配置 import { reducer, defaultState } from './store'; export const StateContext = createContext({}); export const MutationContext = createContext({}); export const Con原创 2021-01-04 13:21:11 · 273 阅读 · 0 评论