react的数据管理库有不少,最常听到的可能是mobx redux altjs之类的,当然还有很多其他,可以自己搜索。

为什么需要数据管理库呢,因为react本身只是为了实现view的表现,而不是数据的管理。

而数据类库就是为了实现react的不能之数据管理。也就是model层的分区管理。这个model层你可以实现对后台数据的引入和输送到view层的展示,还有可以依靠数据的改变触发view层的展现的改变,从而实现前端视觉状态的改变和复杂展示、动态展示等,所以我们需要有一个数据类库如mobx来帮我们管理react下前端的数据管理,实现分别出来model层。

只要model层的数据改变,也就是我们在model层操作数据,如果这个数据关系到view层的展示,那么react view就会实现视觉状态的改变,从而实现动态性功能性的前端视觉展示,和我们之前用的jq有很大的不同,对前端的视觉改变不在是依靠dom的操作插入删除等操作,而是依靠对数据的管理来改变前端视觉的展示。数据的改变数据类库就会自动触发react view的视觉改变,这个我们前端的视觉展示操作改变的思想就是对数据的操作的改变。而react是专注view层的一个库,这个库有非常好的前端视觉改变操作性能,依靠其优秀的算法来实现视觉层的改变。这个良好的view视觉改变性能是react得到推崇的原因,其优越的视觉改变速度是原来dom操作无法实现的速度,至于react具体是怎么实现这么好的性能来改变前端视觉展示,我们不得而知,这个fc的研究成果,有强大研究动力的人可以自己去研究一下其内核和算法。

基本上现在的许多前端框架都是已经和原来的jq之类的直接操作dom的前端框架有很大的区别了,现在主要流行的且是大趋势的方法就是操作数据也就是变量的改变来达到控制view层的视觉展示改变。所以要有良好的前端能力需要对此有所深入掌握,也就是model层是数据池,这个数据池的内部变量的改变可以实现view的展现的改变。现在我们需要的能力的基本是能够搭建好view层和model层的桥梁,搭建好基本桥梁后,model层数据的改变能够符合逻辑思路和预期的视觉改变,搭建好基本的model与view的连接桥梁后,我们想要控制view层的改变主要是通过在model层改变数据操作数据来达到被改变后的数据自动触发view层视觉展示的改变。从而实现前端的一系列目的性的实现---前端动态界面的正确展现。

不管多复杂的数据操作,以react这个拥有优越性能的前端视觉展现能力的前端框架,我们就可以实现良好的视觉改变于人类肉眼所不能轻易所觉察出来的间隔展现切换,model里的数据改变快速触发了view 快速的视觉展现的切换,实现良好的前端界面动态控制,且能够有良好的性能体验,视觉改变的性能能达到用户预期的心理接受度。另外react框架主要流行的是单页应用的制作,而单页应用虽然初期加载量相对比较大,但是加载成功基本的js包后就可以实现拥有比原来dom操作更好的界面性能的体验,总体而言react的单页应用优势和优秀的view界面性能,可以实现良好的应用体验。

react 数据管理之state思想指南的更多相关文章

  1. 说说React组件的State

    说说React组件的State React的核心思想是组件化的思想,应用由组件搭建而成, 而组件中最重要的概念是State(状态). 正确定义State React把组件看成一个状态机.通过与用户的交 ...

  2. React 中的函数式思想

    函数式编程简要概念 函数式编程中一个核心概念之一就是纯函数,如果一个函数满足一下几个条件,就可以认为这个函数是纯函数了: 它是一个函数(废话): 当给定相同的输入(函数的参数)的时候,总是有相同的输出 ...

  3. React组件的state和props

    React组件的state和props React的数据是自顶向下单向流动的,即从父组件到子组件中,组件的数据存储在props和state中.实际上在任何应用中,数据都是必不可少的,我们需要直接的改变 ...

  4. React入门---属性(state)-7

    state------>虚拟dom------>dom 这个过程是自动的,不需要触发其他事件来调用它. state中文理解:页面状态的的一个值,可以存储很多东西. 学习state的使用: ...

  5. React组件的State

    React组件的State 1.正确定义State React把组件看成一个状态机.通过与用户的交互,实现不同状态,然后渲染UI,让用户界面和数据保持一致.组件的任何UI改变,都可以从State的变化 ...

  6. react native中state和ref的使用

    react native中state和ref的使用 因props是只读的,页面中需要交互的情况我们就需要用到state. 一.如何使用state 1:初始化state 第一种方式: construct ...

  7. React 三大属性state,props,refs以及组件嵌套的应用

    React 三大属性state,props,refs以及组件嵌套的应用 该项目实现了一个简单的表单输入添加列表的内容 代码如下 <!DOCTYPE html> <html> & ...

  8. Webpack+React+ES6开发模式入门指南

    React无疑是今年最火的前端框架,github上的star直逼30,000,基于React的React Native的star也直逼20,000.有了React,组件化似乎不再步履蹒跚,有了Reac ...

  9. react~props和state的介绍与使用

    props是参数的传递,从上层模块向下层模块进行拿传递:而state是提局域变量,一般在本模块内使用,props是不能改变的,而state可以通过setState去修改自身的值. props Reac ...

随机推荐

  1. mysql-8.0.12 安装+配置, Navicat Premium 12 安装+激活

    1.解压到安装目录,如:D:\mysql-8.0.12-winx64 2.将以下配置文件粘贴到安装目录,并保存为my.ini,注意:使用ansi 而非utf-8编码格式保存 [mysql] # 设置m ...

  2. 实现一个函数,可以左旋字符串中的k个字符

    ABCD左旋一个字符得到BCDAABCD左旋两个字符得到CDAB ABCD BACD BCAD BCDA CBDA CDBA CDAB 发现规律: 如果左旋一个字符则可以将第一个字符依次与后面的字符交 ...

  3. Python之安装pip

    安装Python之后,命令行语句定位到其安装目录下的Scripts目录 如我的安装目录是:D:\python\Scripts 然后执行命令:easy_install.exe pip就会开始安装pip ...

  4. 22 初始模块 random time collections functools

    一 .初始模块 1.从⼩到⼤的顺序: ⼀条代码 < 语句块 < 代码块(函数, 类) < 模块 2.引入模块的方式 ①   import   模块 ②   from   模块  im ...

  5. ML(附录3)——过拟合与欠拟合

    过拟合与欠拟合 我们希望机器学习得到好的模型,该模型能够从训练样本中找到一个能够适应潜在样本的普遍规律.然而,如果机器学习学的“太好”了,以至把样本的自身特点当作潜在样本的一般特性,这就使得模型的泛化 ...

  6. 什么是 PWA?

    出处:https://segmentfault.com/a/1190000012353473

  7. bzoj 3600 没有人的算术——二叉查找树动态标号

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=3600 已知 l 和 r 的排名,想快速知道 k 的排名.那么建一个 BIT ,用已知的排名做 ...

  8. InfluxDB中文文档

    来源:https://github.com/jasper-zhang/influxdb-document-cn InfluxDB中文文档 InfluxDB是一个用于存储和分析时间序列数据的开源数据库. ...

  9. 在MacOSX系统上的一些工具和问题汇总

    Android 模拟器 1. 安装模拟器 点击链接:https://cloud.genymotion.com/page/launchpad/download 需要先注册登录一下. 2.安装Virtua ...

  10. NET Core Kestrel部署HTTPS

    NET Core Kestrel部署HTTPS ASP.NET Core配置 Kestrel部署HTTPS.现在大部分网站已经部署HTTPS,大家对于安全越来越重视. 今天简单介绍一下ASP.NET ...