- 博客(33)
- 收藏
- 关注
RSS订阅原创 使用websocket配合后端，监听同账号异地登录
建议将这个操作放到全局中，保证每个页面都可以监听到异地登录信息，下面以React为例。这个操作需要后端配合，后端根据用户登录状态去给前端提示，普通长链接相对耗费性能。
2024-05-06 10:29:22
236
原创 实现复制文本，以react为例
2.二次封装一键复制组件，方便项目中其他地方使用。中已经开源，直接使用命令安装即可。3.使用时传入参数接即可。实现一键复制文本，以。
2023-08-18 14:57:56
432
原创 props只读性
组件无论是使用函数声明还是通过class声明，都觉不能修改自身的props. 他有一个严格的规则： 所有的React组件都必须向纯函数一样保护他们的props不被更改。
2022-08-03 12:55:01
286
原创 react 生命周期--常用的构造函数
声明周期： 组件从创建到销毁的整个过程，一共有三个阶段： 创建阶段、运行阶段、销毁阶段。当组件被显示在页面中时，会被创建；组件从页面中消失了，会被销毁。要在动态组件上理解组件的声明周期。...
2022-08-03 12:50:30
321
原创 react 表单受控组件
defaultChecked 是默认选中的状态，需要将这个value值设置为初始值。如果后期需要初始化这个状态，需要使用checked 作为前端的默认选中。defaultChecked只是一个状态，并不会在页面上显示。
2022-08-03 12:48:59
408
原创 react key的用法及作用
当列表顺序发生改变时，如果不加key。不管数据是否发生改变，所有列表元素都会重新渲染，当列表元素没有发生改变时，值是在末尾产生新的元素，此时key的值加不加都是可以的，React 只会渲染最后一个元素。不要使用索引作为key值，因为索引是会动态变化的，所有列表元素都会重新渲染。key值要求唯一，且不会变化。不加key 值 浏览器会报错。...
2022-08-03 12:46:30
564
原创 setState分页案例
React对于引用类型的数据，也能实现深层次的监听，对于数组/对象,新增/修改/删除,都能将其渲染出来，而Vue中无法实现了引用类型的深层次的监听关于判断什么收需要立刻获取数据2.1 需要：操作数据的是，需要上一次的数据，比如： 分页2.2 不需要： 与上一次的数据没有关联，例如： onClick 事件，只需要保存这一次的数据一次的数据，比如： 分页2.2 不需要： 与上一次的数据没有关联，例如： onClick 事件，只需要保存这一次的数据。...
2022-08-03 12:43:58
110
原创 react setState特性
在V18 中的优化针对的是原生事件，相对于受React控制的事件是相同的，setState() 在React17 和React18 中的对比。自动批量更新数据，最终只render() 一次。
2022-08-03 12:41:46
274
原创 react 函数组件案例
通过函数封装组件，内部声明组件，会造成组件重复创建的问题。测试：设置一个定时器，可以发现，每次定时器执行，都在声明新的函数组件，同时，ReactDOM.render()也在重复的渲染新创建的组件。在下面获取数据时发现，有了数据冲突，为了解决冲突的问题，使用了全局变量，如果只发送一次请求，可以不声明全局变量，直接通过调用函数传递参数。（4）声明一个渲染DOM的函数，用来接收请求返回的数据，渲染到页面中。，将页面进行初始化，并且以调用函数的方式传递数据。(1).封装一个发送ajax请求的函数。...
2022-08-03 12:38:28
486
1原创 03-JSX
JSX是JavaScript的一种扩展，JSX可以生成React “元素”,可以更加简洁的构建UI结构1.本质上，他只是React.createElement(component,props,…children)函数的语法糖，写代码更加方便快捷2.JSX所描述的代码结构，最终还是会被编译成React.createElement(component,props,…children)的形式3.因为JSX语法上更接近JavaScript而不是HTML，所以ReactDOM使用camelCase(小驼峰命名)来定义
2022-05-31 20:50:56
68
原创 02-React v18创建元素
一、引入React v18<script src="https://unpkg.com/react@18.1/umd/react.development.js"></script><script src="https://unpkg.com/react-dom@18.1/umd/react-dom.development.js"></script>二、HTML代码<div id="main"></div>三、 Re
2022-05-31 20:50:01
409
原创 01-react 入门
2.react 与原生DOM的对比html 代码2.1 原生js操作DOM知识点（1）let E = document.querySelector(‘E’); 获取页面元素（2）let E = document.createElement(“E”); 创建新的元素（3）E.innerText = 内容; 在元素E中填充内容（4）父元素.appendChild(要追加的子元素);2.2 react 操作DOM知识点（1）React.createElement(“元素名称”, 元
2022-05-31 20:49:14
49
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人