react-relay的探索历程
上次写感想还是2014的时候，那个时候是老师布置的作业（尴尬)
队长看到GraphQL很好，于是先拿一个功能来试手😊。
前端要使用GraphQL，最简单的方法是使用ajax发送query字符串。这个方法，若query嵌套层级太深，会导致query很长，长的让人接受不了；再者，假如数据变化，需要你手动的去改变DOM。项目中使用了react，于是队长给推荐了react-relay来配合GraphQL。
首先给的时间是看GraphQL和react-relay的文档，先瞄一眼relay的文档，感觉是层层嵌套，就先去看GraphQL的文档，relay的文档没有看完…😶
第一天
开始在队长的鼓励下开始写relay，到了relay的官网上，看到有一个Demo，就把代码给copy下来，再根据文档理解了代码的意思，就开始尝试着写代码。写代码的过程有点别扭，刚开始接触，会犯一些错误。但是又不知道错误发生的原因，于是就开始google解决。也想吐槽一下文档，文档上说，fragment的name建议是fileName_propsName，于是为了名字短点，就全部改了，结果编译的时候，告诉我是must be。😢
代码终于不报错了，但是需要一个schema的文件。我想手写schema太繁琐了，也是去查有没有自动生成schema的插件，但是很遗憾，我找到都是配合node使用的（假如你有好的插件，请推荐给我，谢谢）。找啊找，找啊找，也没找到合适的，最终是队长上网找了一个工具生成的🤗。schema的问题解决。schema的存在是为了映射fragment的type。
这个时候，大哥过来问问我怎么样了，我告诉他，虽然安装了react-relay，可是文档上的方法不存在，我就很暴力的改了源码，将方法暴露出来。他告诉我relay现在有两个版本：classic和modern，modern是最新的。我弱弱的问一句，咱们用哪个版本，他说当然是最新的。我的内心在哭泣😭。既然只是版本的迭代，思想肯定没有太大的变化，于是打起精神来看文档。👉这里是我太心急了，直接看了Demo，就ctrl+f去直接搜方法了，没有整体的先浏览一下文档，要不然也不会有这个不可预料的情况。
第二天
边看文档，边改我的代码。👉刚开始报错是“没有配置babel或者graphql写错了”，假如你的babel配置是按照文档来的，那最有可能的就是你的fragment或者query写错了。最简单的query可以正常的渲染出来了，因为是query中需要有参数，所以开始看如何使用参数。在查资料的时候，这个链接给了我很大的帮助。但是在这个过程中，下面的错误伴随了我十个小时，我一直在尝试解决这个错误，于是上网查啊查 查啊查 查啊查
也没找到答案
第三天
大哥说他写出来了，我看了他的代码，对比我的代码，唯一的不同是，我将edges和node要写在不同的fragment中。我尝试在正确的代码上改成我设计的fragment，功能就报错了。我意识到，需要将edges和node写在同一个fragment中。👉出现这个错误的原因是，我已经封装好的fragment，出现这个错误，我全部的心思都放在了index.js，没有检查我封装好的组件。假如再来一次，我也会被困在这个error上出不来。之后因为还有一个加载更多的动作，于是我开始完成这个功能，在这个过程中，我学会了react父子组件如何传递消息。
测试
功能完成好了。但是在进行测试的时候，再看network时，加载更多这个按钮是通过first这个参数来进行请求数据，first的意思就是取前first数据，后端限制first只能取到50，即使可以取到1000，但是在网络上传输1000条数据，也是一笔庞大的负担。relay也提供了分页的container，但是没有研究出来是怎样使用的。于是relay需要更换….所以，没有一个很好的方式来解决这个问题。👉队长又给推荐了Apollo，接下来要去看Apollo了
待续…