在一个react运用中，怎样经由过程ajax和server端举行交互这个题目曾搅扰了我一段时间，经由进修实践，有了一点心得体会，写出来和人人分享一下。
总的来讲，我晓得的react ajax交互体式格局大抵有以下4种：
Root Component
Container Component
Redux/Flux Async Actions
Relay
Root Component
这个是最直接的体式格局，异常适宜原型和小型运用开辟。
完成计划
完成起来也很简朴，在全部运用的最顶层，有一个root component。一切的ajax要求都在这个组件的componentDidMount中提议，并将返回的效果作为本身的state保留，同时，经由过程props向基层组件通报数据。
不足
假如运用比较大，组件嵌套比较深的话，data得经由过程props一同传下去……(固然，也能够经由过程context的体式格局，不过context用来传data并不适宜)
运用场景
运用比较简朴，组件树不深
没有用Redux或许Flux
Container Component
这个计划和root component很像，区分在于能够同时有多个container和server交互。
完成计划
起首要把component区分为container和presentational两类。
container组件和root component一样，和server举行ajax交互，将猎取的data经由过程props向下通报给presentational组件。
运用场景
组件树比较深
须要从差别的server或许api猎取数据
没有用Redux或许Flux
Redux/Flux Async Actions
假如已经在运用Redux/Flux，经由过程他们来治理数据是很天然的事变。
完成计划
完成上，Redux官方文档有个很好的示例。
简朴来讲，就是完整不在组件中提议ajax要求，将这些操纵放在async actions中举行。
运用场景
运用和Redux或许Flux
Relay
Relay就完整是别的一个天下了，和前面三种有本质区分。
Relay适用于大型运用（比方facebook），运用Relay必需同时供应一个GraphQL server。
完成计划
起首，得有一个GraphQL server，然后，还得用GraphQL（而不是propTypes）定义组件须要的数据。剩下的交给Relay就好了，他会担任自动下载须要的数据并填充到组件的props内里。
不足
Relay被设想用来和GraphQL效劳器一同运转，并不能很好的和第三方json效劳交互。
现在，Relay彷佛只能和一个GraphQL效劳器衔接。
运用场景
超大型运用
不盘算运用json API
