2019年05月_care_yourself

原创 react中store与数据流

react中store与数据流store对于store在官网给的定义中，它是一个对象，包含了action与reducer等的一个组合。对于store，其有以下的职责： 1.保存当前的state 2.允许通过getState()去访问...

2019-05-31 22:55:19 14570 1

原创 redux中action与reducer

redux中action与reduceraction对于action，将数据从应用程序发送到存储的有效信息负载。可以将其理解为用户对于要去操作某个动作而做出的反应。是改变store数据的唯一方法。可以通过store.dispatch(action)，将其发送给s...

2019-05-29 23:35:49 2478

原创 redux中的三个原则与先前技术

redux中的三个原则与先前技术1.数据来源的唯一性在redux中所有的数据都是存放在你的store中，这样做的目的就是保证数据来源的唯一性。那么为什么要这样做呢？使得创建通用应用程序变得很容易，因为服务器的状态可以序列化并水合...

2019-05-29 16:51:20 1652

原创 redux安装与使用

redux安装与使用安装redux的安装通过npm安装的方式是这种方式是假设你使用了npm作为你的包管理，如果你不是这样做的，你也可以去接受这些文件到你的unpkg里面。下载它们，然后用包管理器去指向它们。在大多数的...

2019-05-29 15:20:38 8197

原创 react中的检查属性类型、不受控组件和web组件

react中的检查属性类型、不受控组件和web组件检查属性类型在react中，也提供了一下特殊的检验方法，其主要是对接受到的props的类型进行检验，下面先举一个实际的例子。在上面的代码部分中，主要去name属性的类型进行了一个检验，其检验的内容是接受一个字符串形式的name，因此...

2019-05-28 22:10:41 322

原创 react中的render props与静态类型检验

react中的render props与静态类型检验render props是一种术语，指的是一种技术在react组件之间的函数中来共享代码。一个带有render props的组件接收一个函数，调用这个函数而不是去实现自己的逻辑渲染。render pr...

2019-05-28 21:22:48 494

原创 react中的reconciliation与ref and DOM

react中的reconciliation在react高级指南中说到了一个reconciliation(协调)，这部分的内容主要说明了在react中，怎样去渲染，怎样去协调你的代码。在这里说到了一个DIFF算法，其算法复杂度为O(n)。那么这个算法有什么用呢...

2019-05-27 23:04:47 247

原创 react中的portals，es6和JSX

react中的portalsportals(门户网站)portal提供了一种一流的方式，将一个存在于DOM节点之中的一个子节点，用于去父组件节点之外的地方。其语法规则是：在createPortal中，第一个参数指的是任何一...

2019-05-27 21:26:30 268

原创 react中的性能优化

react中的性能优化在项目开发的过程中，当你完成了一个产品的开发并不算你项目的结束，因为你还要去考虑你的代码的执行效率，项目的运行速度等问题，因此在react中，有如下的办法去提升你在项目开发中的效率问题1.使用生产构建，如果当你在产品的测试或...

2019-05-27 09:50:22 512

原创 react中集成其他框架与JSX Depth

react中集成其他框架与JSX Depth集成其他框架在react中去集成其他的框架，就是意味着你可以在react中去使用其他的框架，例如jquery等一些js框架，但是需要注意的是，你必须去清楚每一个操作在react中会产生什么样的行为，会不会是react...

2019-05-26 19:58:02 309

原创 react中的fragments与HOC

react中的fragmentsHOCfragment对于fragment的最初接触是在做todoList这个功能的时候，在render()中你return的必须是一个整体，如果你使用<div>去包裹这个整个的组件，那么这个div就会显示在你...

2019-05-26 10:20:20 359

原创 react中的Error Boundaries

react中的Error Boundaries在没有去认真阅读过react高级指南之前，对于错误界限这个概念毫无任何认识。在阅读过官网文档之后，对于Error Boundaries这个概念便有了下面的认识。Error Bound...

2019-05-25 21:13:46 967

原创 react高级指南之可访问性与代码拆分

react高级指南之可访问性与代码拆分web可访问性对于可访问性，你需要记住下面的几点即可1.当你用鼠标聚焦和键盘聚焦时，两者之间放在一起发生的易混淆的访问过程，这使得浏览器不知道自己访问的是哪一个信息2.语义HTML：其是web应用程序可访问性的基础。使用各种HTML元素来...

2019-05-24 23:51:43 147

原创 react状态提升和容器组件

react状态提升和容器组件react状态提升通俗的说，对于react状态提升的核心就是去状态共享。我们可以通过下面的一个功能来进行说明。我们要实现的一个功能就是当你在一个输入框中输入华氏温度，你就可以在另外一个输入框中，得到摄氏度；当你在摄氏度的...

2019-05-24 21:00:27 244

原创 react学习之key与表单

react学习之key与表单1.key在react的数组中，你必须要保证下面的这点，那就是你们数组的每一项都必须有个key值，因为键帮助React识别哪些项已经更改、添加或删除。数组内的元素必须有键，以确保元素有一个稳定的标识。在这个例子中，我们使用了数组的m...

2019-05-24 19:53:41 425

原创 react学习之事件绑定与条件渲染

react学习之事件绑定与条件渲染事件绑定：对于事件绑定，其在react中的绑定方式就与js中在DOM中的绑定方式相同，但是也有区别。区别： 1. 绑定事件的属性的命名方式是采用的小驼峰式的命名方式，因为你react是更加的接近js而不是html 2...

2019-05-24 17:09:10 526

原创 react学习之组件与生命周期函数

react学习之组件与生命周期函数1.组件组件就像是js中的函数一样，它接收任意的输入，并且返回一个react元素，这些元素被返回在我们的屏幕上给展示出来。2.组件的分类组件分为无状态组件（函数组件）和有状态组件（类...

2019-05-22 23:35:03 184

原创 react学习之jsx与元素渲染

react学习之JSX与元素渲染1.什么是JSX? 可以理解为将类似于html中的标签放在js的文件中的形式，这样做的好处是，你不需要像纯js那样去引入你的dom节点,去进行你的dom操作。在JSX的语法中，你也可以自己定义组件，但是需要注意的...

2019-05-22 22:17:04 294

原创 react安装与其引入方法

react安装与其引用方法 1.适合于开发练习使用react的方式首先引入下面的两个文件到你的项目中然后你再引入上面的文件是你将要写js代码部分，然后就可以在这里去进行项目的书写2.适合于产品开发的安装方式使用官方提供的脚...

2019-05-21 23:10:17 660

domino~~的博客