React
文章平均质量分 86
React知识总结,示例演示
suwu150
业精于勤,荒于嬉;行成于思,毁于随;磨刀不误砍柴工。
展开
-
日常开发为什么需要做Code Review
出现这种情况的常见算法一般都是先找出数组中固定的某一个值,然后在用这个值去做业务逻辑,这样可能得和业务人员确定是否存在更加优化的处理方案,比如下面是用了es6中结构赋值的方案去减少了一次检索的过程,这种双循环的,一般都仔细检查下看看是否有优化方案。提高代码质量: 可以帮助开发者更好地编写代码,减少错误和缺陷,提高代码的质量和可维护性。看的我是一堆乱麻,不由得让我开始思考,程序员果真是懒,如果再勤快一些,可能会进行代码的封装和考虑这些公用方法及组件的抽取,同时也存在项目中Code Review 的缺失。原创 2023-05-04 22:36:36 · 2497 阅读 · 1 评论 -
React Native中防止滑动过程中误触
解决这次触摸,主要是使用点击事件本身的一个响应机制,在中间通过记录状态值的方式去处理使用到的方法涉及到按下时、抬起时、按下这三个过程通用功能组件需要进行封装,以达到业务功能上的适配。原创 2023-05-04 22:26:56 · 2659 阅读 · 0 评论 -
Nodejs如何在一个文件中获取里边的中文字符
使用了nodejs中文件处理系统fs处理文件的读取使用正则表达式匹配对应的中文使用换行符划分了每一个独立的行,也可以通过fs.createReadStream(filePath);进行按行读取这里只是读取了一个文件的中文字符,但我们项目中包含很多个文件,我们需要遍历整个项目去获取文件名称和对应的行数,这个可以考虑使用fs中readdir进行获取,同时使用递归的方式,有兴趣的小伙伴可以尝试下如何处理。原创 2023-03-25 18:37:54 · 995 阅读 · 0 评论 -
useMemo和useCallback:何时使用它们,何时不使用它们
我们都被告知要使用 React 钩子useMemo和通过让 React “记住”复杂的计算来提高性能。每当我们将大量逻辑包装到这些钩子中时,它们真的能提高性能吗?在本博客中,我们将了解这些钩子的作用并进行一些实验以了解它们对整体性能的影响。翻译 2022-10-30 15:10:23 · 449 阅读 · 0 评论 -
React中createElement 和 cloneElement 的区别
React.cloneElement()与 React.createElement()相似,不同的是它传入的第一个参数element是一个 React 元素,而不是标签名或组件。如下,使用cloneElement进行创建jsx元素,在这里我们将createElement创建的element对应的 React 元素做为基点,然后进行克隆,在克隆的过程中,进行添加。有了以上知识的认识,我们可以在以后的组件封装中进行更加React化的设计,通过封装公共组件供其他页面迭代使用,进行我们业务功能更加接近的封装。原创 2019-01-21 16:13:18 · 12213 阅读 · 1 评论 -
基于react开发的可伸缩tabs选项卡
1.效果如下所示: 2.自己安装查看效果 先克隆该项目 git clone https://github.com/suwu150/react-flex-tabs.git 然后通过以下命令安装依赖 npm install 通过以下命令运行项目 npm start 3.flex-tabs组件简介 a. 能够通过传入的对...原创 2018-06-17 17:41:35 · 2536 阅读 · 0 评论 -
如何构建一个最简单的electron应用
electron的继续学习—-如何构建一个最简单的electron应用下面,我们就来进行构建一个hello World项目1 准备工作一个最基本的 Electron application 需要这些文件: - `package.json` - 处理应用的以来和说明性信息. - `main.js` - 入口页面和渲染html页面. 这个文件是应用的 **main process**.--主进程原创 2017-03-24 10:30:44 · 4215 阅读 · 0 评论 -
基于打包工具Webpack进行项目开发
一. 常见打包工具的介绍在打包工具中,常见的有RequireJS,browserify,webpack,其中RequireJS是一个JavaScript模块加载器,基予ADM(async module define)规范实现,browserify是一个以在浏览器中使用Node.js模块为出发点的工具,而webpack则是一个为前端模块打包构建而生的工具.二. 工具的使用(1)作为npm包的Requi原创 2017-08-17 16:50:36 · 16883 阅读 · 0 评论 -
qs.parse()、qs.stringify()使用方法
如上所示,前者是采用JSON.stringify(param)进行处理,后者是采用Qs.stringify(param)进行处理的。命令进行安装.是用于将对象序列化URL和反序列化的一个工具类。qs是一个npm仓库所管理的包,可通过。也可以进行重写这种默认方式为。原创 2017-10-24 19:32:26 · 166999 阅读 · 5 评论 -
修改浏览器滚动条样式
CSS设置滚动条样式 因为在现在的大部分项目中很多都用到了滚动条,有时候用到模拟的滚动条,现在说下滚动条的CSS也能解决。 比如网易邮箱的滚动条样子很好看,就是利用的CSS来设置的,而且是webkit浏览器的。 一:webkit的CSS设置滚动条1.1 主要有下面7个属性::-webkit-scrollbar 滚动条整体部分,可以设置宽度啥的::-webkit-scrollbar-butto原创 2017-12-28 16:10:14 · 5032 阅读 · 0 评论 -
mapStateToProps,mapDispatchToProps的使用详解
前言 刚接触redux的时候,发现大家对mapDispatchToProps使用有几种方法,而且都跑通了,本文来介绍下,redux的mapStateToProps,mapDispatchToProps的一些使用方式。mapStateToProps(state, ownProps) mapStateToProps是一个函数,用于建立组件跟 store 的 state 的映射关系 作为一个函...原创 2018-03-01 17:30:52 · 41737 阅读 · 0 评论 -
React中静态类型校验-PropTypes学习
PropTypes学习 官方网址详细说明1.基本说明PropTypes定义为组件类自身的属性,用以定义prop的类型。在开发模式下,当提供一个不合法的值作为prop时,控制台会出现警告;在产品模式下,为了性能考虑应忽略propTypes Prop types 是一个在运行时使用的新特性. 我们能够通过下面的方式在我们的团队里边使用.2.版本更新在15.5版本之后, 代替...原创 2018-03-06 16:46:47 · 14773 阅读 · 0 评论 -
React学习笔记----如何在html页面中使用react
React学习笔记----如何在html页面中使用react一、ReactJS简介React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写一套,用来架设 Instagram 的网站。做出来以后,发现这套东西很好用,就在2013年5月开源了。由于 React 的设计思想极其独特,属于革命性创新,性能出众,原创 2017-05-29 12:01:46 · 22574 阅读 · 1 评论 -
React中ref属性的使用
1、在ref使用的过程中,需要注意的是:0.14.8版本及以前用 this.getDOMNode() 或者 this.findDOMNode(this.refs.tip)15.0版本后用 ReactDOM.findDOMNode(this.refs.tip);2、我们通过代码进行对ref的学习:如下面代码:<html><head> <m...原创 2017-05-29 14:52:53 · 6775 阅读 · 0 评论