首先创建react项目可以先下载脚手架create-react-app(类似于vue的脚手架vue-cli)。 ①打开cmd，执行：npm install -g create-react-app ； 全局安装。 如果执行失败，可能是node版本问题， react文档中要求Node >= 8.10 和 npm >= 5.6，查看版本：node -v；npm -v；如果node版本低，可以去node官网下载Download | Node.js；（下载完成后，记得编辑环境变量和配置全局

React Native获取图片的真实大小 我们在项目开发中，为了能够让图片在我们前端显示的时候不会变形，我们通常会根据图片本身的真实宽高进行计算比例，这种计算之后再设置给图片的属性，就能够展示出我们理想的图片。 使用场景： 优化展示，等比缩放 封装图片组件加载动画时，给容器指定适配图片宽高的大小 图片自适应 下面总结了下获取图片属性大小的方法 一、getSize 我们在查阅资料后，能够发现官方提供了获取方案，静态方法 getSize()。 使用过程 Image.getSiz

Router的基本使用介绍 认识React-Router 目前前端流行的三大框架, 都有自己的路由实现: Angular的ngRouter React的ReactRouter Vue的vue-router React Router在最近两年版本更新的较快，并且在最新的React Router6.x版本中发生了较大的变化。 目前React Router6.x已经非常稳定，我们可以放心的使用; 说明一下, Router4.x和Router5.x的区别

一、useCallback的作用 usecallback不是用来解决组件中有过多内部函数导致的性能问题： 1.我们要知道，js创建一个函数的成本是非常小的，这点计算对于计算机来说是小case 2.其实使用useCallback会产成额外的性能：对deps的判断 3.其实每次组件重新渲染时，都无所谓避免重新创建内部函数，因为即使useCallback的deps没有变，它也会重新创建内部函数作为useCallback的实参 那么，它的作用到底是什么？useCallback的作用其实是用来避免

基于优雅漂亮的 ant design 开发的管理后台，为数不多的好看 admin。 关于 Antd Pro Vue Antd Pro Vue 是一个企业级中后台前端/设计解决方案。在本站建站之初就推荐过 Ant Design，这是阿里出品的免费开源的 web 前端 UI 组件库以及一套设计方案，主要用于开发 PC 端企业中后台管理系统。 而 Ant Design Pro 则是官方出品的基于 Ant Design 开发的 admin 后台管理系统，和 Ant Design 一样初期

前端的中后台管理系统相比于其他普通项目，从开发设计的角度来说有几点比较特殊： 一个是权限设计，具体实现可参考：传送门。 一个是页面布局的设计，也是本文要说的。一个好的页面布局设计，无论是对于页面结构的稳定性，还是功能拓展的方便性，亦或是用户体验上，都有着重要的作用。 一、市面参考 先来看看市面上的一些优秀的开源系统项目的页面布局。 1、vue-element-admin vue-element-admin 是 vue 框架的一个优秀的后台管理系统开源项目，目前star数75k。

React-监听页面展示（处理ios缓存情况） android 返回一般默认会清除缓存、刷新页面，不存在缓存情况；ios 返回一般会存在缓存情况。But，为了避免特殊情况，我都进行了处理~ 一、前言 在项目中，遇到一种现象：当切换A页面进入B页面，再返回A页面时，并未调用A页面生命周期componentDidMount里的方法（比如：刷新页面、调用接口请求数据等）。 比如：当我们完成浏览任务时，点击任务列表里的「去完成」按钮，跳转到指定的链接页面里完成任务后，返

大家上午好呀~ 今天来学习一下React的UI组件库以及antd的使用相关的知识点。 感兴趣的小伙伴可以给个三连哦~ 🔻React UI组件库 🔥流行的开源React UI组件库 material-ui（国外） ant-design（国内蚂蚁金服） 🔥antd的基本使用 antd 是基于 Ant Design 设计体系的 React UI 组件库，主要用于研发企业级中后台产品。 安装antd组件库： npm install antd --save

1.前言 上一篇文章说了一篇文章带你玩转前端所有模块化，有了模块化，那么肯定需要模块化打包工具，那么从这一篇文章开始，我将开始来讨论下webpack模块化打包工具，Webpack有一定基础的读者可以选择略过，对于零基础的同学，跟着我一起学，后面我会持续更新，看完的话会受益很多！废话不多说，进入正题！ 2.Webpack是什么？有什么用？ Webpack是一个开源的JavaScript模块打包工具，其最核心的功能是解决模块之间的依赖，把各个模块按照特定的规则和顺序组织在一起，最终

1、React Native 源码分析（一）—— 启动流程2、React Native 源码分析（二）—— 通信机制3、React Native 源码分析（三）—— Native View创建流程 4、React Native 源码分析（四）—— 任务调度 5、React Native 源码分析（五）—— 事件分发 前两篇分析了，React Native 的启动和 通信机制，这篇来分析一下，在收到React 的通信数据字符串后，是如何在原生创建对应的View，React标签设置的View的属性

经过近两个月的优化后，React Native发布了0.70版本，主要带来了如下的一些功能： 新架构涉及的文档的更新； Hermes 作为默认引擎 Codegen 新的统一配置 Android 库自动链接 对 Android 构建的完整 CMake 支持 其他亮点 1，New Architecture 的新文档 在过去的几个月里，Meta一直在努力为文档中的New Architecture部分增加更多的说明内容。在新增的内容中，开发者可以很容易的找到迁移指南、例子和教程，

因为项目原因，需要查找开源埋点工具。发现Github上有众多埋点工具，但实际上多数为虚假开源（即无法真正应用于生产的开源，大部分都类似demo），此类工具都是通过虚假开源后引流到商业化售卖的，此处就不做列入备选参考。列入备选的都是纯开源方案，可能因为关注度和精力，会有错漏，请多包涵指正。开源埋点工具可选方案： 1、Javascript 无痕埋点辅助工具库(React,Vue)，track everywhere 地址：GitHub - Qquanwei/trackpoint-tools: Ja