![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
React
文章平均质量分 53
zhongshizhi91
前端码农. js ts react html5 css3 liunx php 欢迎一起交流
展开
-
实战 react-redux 在vite 中的应用
关键点多个reducer 如何统一导出如何在dispatch时 指定对应的reducer如何在每个 reducer 中初始化自己的state.项目githttps://github.com/zsz91/vite-react 欢迎fork直接上代码store.tsimport { createStore,combineReducers } from 'redux';import reducers from '../reducer';export default createStore(原创 2021-09-16 13:36:28 · 626 阅读 · 0 评论 -
主流前端框架的实现原理
主流前端框架的实现原理StackOverflow 报告 2021热门Web领域框架(前后端)排名SvelteASP.NET CoreFastAPIReact.jsVue框架开发的应用抽象(3层)应用 => 组件 => 节点最小的单位是节点节点+ 业务逻辑 = 组件多个组件 = 应用框架的工作原理UI = f(state) // UI 是视图 state是状态 f是框架内部的运行机制框架之间的区别主要是***更新粒度***的区别 应用级 > 组件级 &原创 2021-08-31 23:40:23 · 633 阅读 · 0 评论 -
使用commonjs加载React组件模块
为什么要用commonjs 加载组件需求场景: 现在有大量的子组件存放在对应文件夹, 但是我在父组件每次只需加载其中一个即可,我不想一次性导入大量的子组件,然后加判断筛选出对应组件。这样代码可能会非常多、杂( 比如我有20个子组件,那么我要写20个import);于是我通过require动态载入直接上代码import React from 'react';const options = [ // 组件列表 { label: '纯布局组件', value: 'Parent',原创 2021-08-31 17:41:35 · 514 阅读 · 0 评论 -
React 与 Vue 的区别 (2021)
主要区别点数据流定位社区文化UI更新模版hookskeep-alve原创 2021-08-11 09:07:45 · 272 阅读 · 0 评论 -
为什么react要使用JSX
官方文档什么是JSX?1.一个 JavaScript 的语法扩展为什么使用JSX?React 认为渲染逻辑本质上与其他 UI 逻辑内在耦合,比如,在 UI 中需要绑定处理事件、在某些时刻状态发生变化时需要通知到 UI,以及需要在 UI 中展示准备好的数据。React 并没有采用将标记与逻辑进行分离到不同文件这种人为地分离方式,而是通过将二者共同存放在称之为“组件”的松散耦合单元之中,来实现关注点分离。在html文件中不使用JSX 创建dom 节点react<script crossor原创 2021-04-21 15:10:07 · 655 阅读 · 0 评论 -
使用Babel.transform 转换 jsx代码为js代码并执行
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <titl原创 2021-07-19 17:46:26 · 1528 阅读 · 0 评论 -
老旧项目中使用react 和 antd
起因没有webpack等构建工具的老旧项目(jquery等开发的) 但是需要维护,修改部分功能没有react,开发效率太低下.老旧代码太难读懂,且没有学习价值.具体步骤加载以下文件(js, css) 可在react官网 和 antd-design官网中下载<script src="scripts/react/react.production.min.js"></script> <!--react--><script src="scripts/r原创 2021-07-02 00:22:42 · 338 阅读 · 0 评论 -
setState 同步异步 半自动批处理 React18全自动批处理
什么是批处理(batchedUpdates):React会尝试将同一上下文中触发的更新合并为一个更新批处理的好处合并不必要的更新,减少更新流程调用次数状态按顺序保存下来,更新时不会出现「竞争问题」最终触发的更新是异步流程,减少浏览器掉帧可能性批处理的几种类型v18的「批处理」是自动的v18之前的 React 使用半自动的「批处理」.React同时提供了一个API 手动 「批处理」unstable_batchedupdates .半自动批处理在v18之前,只有事件回调、生命周.原创 2021-06-21 07:59:33 · 1030 阅读 · 0 评论