React Native系列(3) - props和state
讲props和state之前先讲3个概念,数据驱动编程、无状态编程和Virtual DOM。
数据驱动编程、无状态编程和Virtual DOM
1. 数据驱动
React是数据驱动的一种编程模式，这是一种非常优秀的思想, web server编程(后端)可以算是一种数据驱动编程模式吧，客户端请求的url、session、cookie和请求参数决定了输出啥内容，输出结果不会受到用户前后操作的影响,完全数据驱动。
有人会说用户前后操作不是会留下session, cookie吗？这些不会影响输出吗？
会的。但是session、cookie归根到底也是请求数据的一部分，而这些session、cookie数据可以是用户操作引入的，也可以是手动写入的。后端判断的是有没有session、cookie数据，而并不关心用户做过啥，没有做过啥。有没有session、cookie，这是数据。用户做过啥，没有做过啥，啥时候做过，是否重复做过，这是状态。
如果不理解的话，你先懵逼一会儿吧。
2. 无状态编程
记住数据驱动的同时请记住无状态架构，无状态架构是写入到http标准里了的，是非常优秀的一种架构，简化了应用的逻辑，剔除了那些繁琐复杂的状态管理。
客户端编程和web server(后端)相比，最麻烦的地方就在于客户端的一个窗口会有非常非常多的状态,某个按钮啥时候隐藏，啥时候显示，etc… 你得小心翼翼地处理每一个转态变化. 转态变迁都在同一个窗口里面，转态很容膨胀和混淆。
3. Virtual DOM
当然了，数据驱动还不足以让React腾飞，离开了Virtual DOM，React的输出是不完美的。 DOM的作用是帮助我们把无状态编程的输出翻译成一种有状态的结果，嗯，我相信你无法理解。Virtual DOM是一个很了不起的东西，学React Native的同学一定要了解这个东西,你可以简单理解为一个UI渲染引擎，本文不做深入讨论。
总之，有了Virtual DOM以后, 我们可以把客户端UI界面的无穷无尽的状态用无状态编程的方式写出来。吁，写客户端的程序员终于可以从那些恶心的状态变迁中解放出来了！
很多写http后端的完全无法理解客户端界面(UI, 限UI，command line是另外一回事)工作的复杂。 严格来讲，http后端页面渲染逻辑要比客户端界面简单非常非常多。
Props和State
绕了大半圈,终于讲到props和state.
先上结论:
React Native所有的UI显示和状态变化都应该有props和state决定。
如果你强制要绕过props和state手动去改变UI, 也是可以的，你高兴就好。
props和state的区别
props是外包传参，初始化的时候就已经固定了。 state是内部变量，是一个组件自己管理的动态的数据。
打个比喻，我用一个播放器播放本地文件，双击视频文件启动该播放器的时候会有一个文件名传给播放器，这个文件名就是props。
播放的过程中，窗口被调多大，用户快进到哪个地方，这些都是运行的时候产生的数据，属于state.
具体来讲，有以下几点区别:
-
首先, state必须是纯string类型、array或者dictionary. 而props类型是不受限的,可以是string, object, array, dictionary, function, 等等，等等…
-
其次, props是控件初始化时传入的，并且props是可以被设置为必选参数强制要求传入的。 state 不是外界传入的，是自己内部管理的一个转态数据容器。
咦，怎么又出现’转态’这个词了？恩，本质上客户端页面还是有转态的，要不然用户每点一个按钮，整个界面就像网页一样闪一下，那客户端和网页还有啥区别呢？
关键的在于’有了React Native Virtual DOM, 你就可以像写无状态应用一样写客户端了，并且写出来的还是有状态的’
有点绕是吗？你可以理解一下web开发，web开发基本上就是无状态的，页面之间没有任何关联，页面内也没有状态变化， 但是，数据库是有转态的，数据库的状态变化导致了网页内容渲染的各种变化。而React正是通过改变state和props来渲染不同的效果.
-
第三，props在组件初始化之后不可变的，页面加载是由props控制的，上层组件通过调用本组件时传入不同的props值来控制初始化的界面显示。
state是有组件自己维护，可变的，在界面首次加载以后所有的变化都应该由state来驱动。
总结
props是不可变的外部传参数，支持多数据类型。
state是可变的内部数据，自己维护，只能是基础类型(string, array, dictionary).
