常规总结一下这些时间遇到的难点吧，防止以后遇到同样的坑
难点一
这次反馈的问题是这样的，在商城购物之后，会给用户发放一定的奖励，但是要看到奖励信息，需要去到里面的星钻信息记录的模块，正常从APP一步步的点击进去是没有问题的，但是购物之后，手机状态栏会弹出星钻发放到账的消息，点击状态栏进入星钻信息记录的模块，却无法看到星钻的任何信息
这个难点是，支付功能不是我这边开发，是安卓那边开发的，星钻到账记录页面却是我是这边开发，又没有开发环境的支付，只能在线上环境支付测试，但是像我这种两袖清贫的人，岂能为了一个bug去付钱呢，这岂不是花钱买难受吗？
说了这么多，回到正题吧，首先想到的是如何复现这个bug,于是想了一个办法，让客户端（安卓开发）做一个模拟星钻到账，在手机通知栏推送消息的app,用于复现bug,装上这个app之后，并没有第一时间发现bug
于是先检查代码，一步步的debugger,把尽可能出现问题的地方都加上log，然后结合app去模拟手机状态栏接收信息，试了十次大概能复现一次，后面把网络调慢了一点，bug复现的次数变多了，通过log打印，分析出来，通过手机通知栏进到星钻记录的页面，刚进去能拿到token，最后渲染发现拿到的token却是空的，就导致需要成功拿到token去拿用户的星钻信息的接口并没有发起请求，这样在星钻记录的页面看到就是空白没有数据的页面。
解决办法：使用componentWillReceiveProps(nextProps) 去对比前后的props是否有变化，有变化，重新客户端的接口，再拿一次token，然后问题就解决了
最后提一点，虽然componentWillReceiveProps(nextProps) 在react的后续版本可能移除，但是公司的react版是16.3，可以放心使用，但是新版本不支持怎么办？
现在已经知道问题的所在，解决方案在网上一抓一大把，重点是解决方法和思路，这远比代码重要。
难点二
是关于穿梭框的，先描述一下需求把，需要用到穿梭框，就是左右各一个框，中间放两个能控制左右穿梭的按钮，穿梭框里面的数据能左右的移动，需求的要求是，穿梭框里面的数据结构是，一个平台包含着一大堆活动，当点击平台的时候，需要把所有的活动都勾选上，移动到右边的时候，左边需要移除刚才移动到右边的数据。
再有就是勾选单个活动的时候，移动到右边，要把对应的平台也带过去，方便观察是哪个平台下的那个活动
然后我就去套用 Ant Design 穿梭框，结果发现穿梭框需要的数据格式是：
const treeData = [
{ key: '0-0', title: '0-0' },
{ key: '0-1', title: '0-1', children: [{ key: '0-1-0', title: '0-1-0' }]},
];
然后我需要拿到后端返回的数据，然后改名处理，可是Ant Design 的API是真的不足，例如，它提供的书穿梭框虽然满足的我需求的数据展示，可以它没有提供 树控件Tree 里面的勾选父亲，会把儿子的都选上，而且移动到右边的数据处理也没有明确给出，参考了网上的做法，说是右边也要做出跟左边的数据结构一模一样才行，于是照做，结果成功了。
于是bug也随之出现了，因为勾选父亲的时候，是遍历children 也就是遍历儿子，要把儿子全部勾上，这样看似没有问题，可是改成穿梭框需要的格式类型之后就出问题了，又是都是{key: 'xxx', title: 'xxx', children:[{key: 'xxx', title: 'xxx'}]}
当我勾选某个活动的时候，假设这个活动的id是28，也就children 里面的 key = 28, 然后我另外一个平台的id也是28，在穿梭框的数据结构中，Key也等于28；
也就是说勾选了单个活动，活动id = 28, 如果有某个平台的id=28就会把这个平台勾上，也就是会把这个平台下面的活动都勾上，这样显然是不对的；
对应的方案是：可以在拿到后端数据的时候，把活动遍历，在所有的活动id后面都加一个点（.）,然后保存的时候再把（.）删除掉，也就是把childrenl里面的key后面都加一个点（.） , children 以外的key就不加点（.）了； 这样就能有效隔离掉平台id 和另一个平台下活动id是一样的情况出现了。
