react项目中的注意点
一、ES6 的编译方法
目前主流的浏览器还不支持ES6。 现在一般采用webpack 和 <script type="text/babel">对jsx 语法进行编译,编译成正常的js语言。type='text/babel' 这个是引用babel.js库。
二、react 中有个PropTypes
在react中组件的属性可以接受任意值,字符串、对象、函数。有时,我们需要一种机制,验证别人使用的组件时,提供的参数是否符合要求。
三、虚拟的DOM
react 中最神奇的部分莫过于虚拟的DOM,以及其高效的Diff算法。当部分节点发生变化的时候,会想在虚拟的DOM上做出改变,然后在总体的反应到真是的DOM节点中。
四、react 中的purRender
import pureRender from 'pure-render-decorator'; 优化刷新,数据没有变化就不刷新。一般会与import { is, fromJS} from 'immutable'; 同时使用。
在'immutable' 中涉及到js的浅拷贝与深拷贝的问题。
1、浅拷贝:子对象获取的只是父对象的一个地址,不是真正意义上的拷贝,当子对象发生篡改时,父对象也会被改变。
2、深拷贝:是将父对象内部的属性真正意义上的全部拷贝出来,而不是单单的拷贝父对象的一个地址。
参考网址:http://www.jb51.net/article/91906.htm
个人觉得immutable 有点类似js 中的深拷贝。
使用Immutable.fromJS` 来创建对象。
五、redux 中的connect
react项目中的注意点的更多相关文章
- 如何在非 React 项目中使用 Redux
本文作者:胡子大哈 原文链接:https://scriptoj.com/topic/178/如何在非-react-项目中使用-redux 转载请注明出处,保留原文链接和作者信息. 目录 1.前言 2. ...
- 如何优雅地在React项目中使用Redux
前言 或许你当前的项目还没有到应用Redux的程度,但提前了解一下也没有坏处,本文不会安利大家使用Redux 概念 首先我们会用到哪些框架和工具呢? React UI框架 Redux 状态管理工具,与 ...
- react项目中实现元素的拖动和缩放实例
在react项目中实现此功能可借助 react-rnd 库,文档地址:https://github.com/bokuweb/react-rnd#Screenshot .下面是实例运用: import ...
- React项目中实现右键自定义菜单
最近在react项目中需要实现一个,右键自定义菜单功能.找了找发现纯react项目里没有什么工具可以实现这样的功能,所以在网上搜了搜相关资料.下面我会附上完整的组件代码. (注:以下代码非本人原创,具 ...
- React项目中使用Mobx状态管理(二)
并上一节使用的是普通的数据状态管理,不过官方推荐使用装饰器模式,而在默认的react项目中是不支持装饰器的,需要手动启用. 官方参考 一.添加配置 官方提供了四种方法, 方法一.使用TypeScrip ...
- 在react项目中使用ECharts
这里我们要在自己搭建的react项目中使用ECharts,我们可以在ECharts官网上看到有一种方式是在 webpack 中使用 ECharts,我们需要的就是这种方法. 我们在使用ECharts之 ...
- 优雅的在React项目中使用Redux
概念 首先我们会用到哪些框架和工具呢? React UI框架 Redux 状态管理工具,与React没有任何关系,其他UI框架也可以使用Redux react-redux React插件,作用:方便在 ...
- 深入浅出TypeScript(5)- 在React项目中使用TypeScript
前言 在第二小节中,我们讨论了利用TypeScript创建Web项目的实现,在本下节,我们讨论一下如何结合React创建一个具备TypeScript类型的应用项目. 准备 Webpack配置在第二小节 ...
- redux在react项目中的应用
今天想跟大家分享一下redux在react项目中的简单使用 1 1.redux使用相关的安装 yarn add redux yarn add react-redux(连接react和redux) 2. ...
- react项目中引入了redux后js控制路由跳转方案
如果你的项目中并没有用到redux,那本文你可以忽略 问题引入 纯粹的单页面react应用中,通过this.props.history.push('/list')就可以进行路由跳转,但是加上了redu ...
随机推荐
- jQuery事件委托之Safari失效的解决办法--摘抄
什么是事件委托 事件委托是Jquery中一种事件绑定的方式,不同于常见的事件绑定方式将事件绑定在目标元素上,而是将事件绑定在父级元素上通过事件冒泡来执行绑定函数. //常见的事件绑定(Jquery) ...
- Java内存区域划分、内存分配原理(深入理解JVM一)
Java虚拟机在执行Java的过程中会把管理的内存划分为若干个不同的数据区域.这些区域有各自的用途,以及创建和销毁的时间,有的区域随着虚拟机进程的启动而存在,而有的区域则依赖线程的启动和结束而创建和销 ...
- Java面试题集(七)--Spring常见面试问题【重要】
以下为spring常见面试问题: 1.什么是Spring框架?Spring框架有哪些主要模块? Spring框架是一个为Java应用程序的开发提供了综合.广泛的基础性支持的Java平台. Spring ...
- Ubuntu 安装PostgreSQL
安装最新版: sudo apt-get install postgresql 安装完成后,默认会: (1)创建名为"postgres"的Linux用户 (2)创建名为"p ...
- elasticsearch入门使用(二) Mapping + field type字段类型
Elasticsearch Reference [6.2] » Mapping 参考官方英文文档 https://www.elastic.co/guide/en/elasticsearch/refer ...
- Netty和Akka有什么不同?
摘要: Akka is a concurrency framework built around the notion of actors and composable futures, Akka w ...
- BZOJ——1610: [Usaco2008 Feb]Line连线游戏
http://www.lydsy.com/JudgeOnline/problem.php?id=1610 Time Limit: 5 Sec Memory Limit: 64 MBSubmit: 2 ...
- 《深入理解mybatis原理》 MyBatis的一级缓存实现详解 及使用注意事项
MyBatis是一个简单,小巧但功能非常强大的ORM开源框架,它的功能强大也体现在它的缓存机制上.MyBatis提供了一级缓存.二级缓存 这两个缓存机制,能够很好地处理和维护缓存,以提高系统的性能.本 ...
- XML Publisher Template Type - Microsoft Excel Patch
XML Publisher Template Type - Microsoft Excel Patch Oracle XML Publisher > Templates > Create ...
- [WASM + Rust] Debug a WebAssembly Module Written in Rust using console.log
Having some kind of debugging tool in our belt is extremely useful before writing a lot of code. In ...