Open Gentlegay opened 9 years ago
我们原先积分商城是全部客户端开发的，原先只支持虚拟兑换，前段时间运营出了一个实物兑换的需求，技术部决定全部由网页实现，顺便把客户端的也改成网页加载形式，前端技术选型，我选择了react+es6。
最先我尝试用fis react去开发，刚开始的时候开发的时候很顺利，我又很贪心的把es6语法加进去了，结果如何编译，成了我的瓶颈，根本没有资料可以参考，这个技术选型方案被放弃，选择了一个普遍用的一个方法，webpack+react。
我选用webpack后发现配置简单的让我吃惊，很顺利的把代码开发和编译部署结合起来了，代码一切ｏｋ，我觉得我可以很顺利的进入开发了，但是实际开发中才发现react并不是想象中的那么好用，给我带来了一些很麻烦的事情。
我在开发中一直喜欢用xxx-xxx.js的格式，但是在配置打包路径时，我只能用xxXxx.js,而使用 xxx-xxx.js直接打包报错，我只能把握项目习惯用得蛇形命名替换成驼峰命名。
我就踩过一个坑，我的列表用push载入的，再使用render渲染后，我发无论使用props,还是state都无法去给push渲染出来的组件赋值，后面是采用React.findDOMNode，去改变实际dom，同时去改变虚拟dom的值的做法，虽然最后解决问题，但是感觉很麻烦。
我看重react的特性之一，可以像vm对页面组件化，但是你一个页面划分多个组件就存在数据传递的问题，比如我的A页面引入了B1,B2,B1页面又引入了Ｃ１，我如果Ｃ１的变化改变Ｂ１的数据，我可以用Ｂ１页面传递个方法到Ｃ１，Ｃ１回调Ｂ１的方法就好了，但是如果我Ｂ２去改变Ｃ１时就很难做了，后面我不的采取和上面问题一样的方法去做。
因为react事件出发方式和目前主流的控件都不一样，我只能去翻git,找了个React 无限滑动组件，我找了个用的最多的组件，发现他在我的android和电脑上表现都不错，最后开发结束到测试时候，发现在iphone上表现不流畅，但是react组件太少了，很多成熟插件因为框架设计思想上的问题都不能用。
我最终上线的js每一个都９００Ｋ以上，觉得太大了。
在各种和坑对抗的工作中，项目终于顺利上线，性能和后期维护上显示出了他的优势，但是遇到的问题也不少，选择react会颠覆一些开发理念，原来感觉很简单的，在react变得复杂（比如数据事件传递），而一些以前处理感觉麻烦的事情变得简单（用数据去改变dom）。
缘起
我们原先积分商城是全部客户端开发的，原先只支持虚拟兑换，前段时间运营出了一个实物兑换的需求，技术部决定全部由网页实现，顺便把客户端的也改成网页加载形式，前端技术选型，我选择了react+es6。
尝试fis和react的尝试
最先我尝试用fis react去开发，刚开始的时候开发的时候很顺利，我又很贪心的把es6语法加进去了，结果如何编译，成了我的瓶颈，根本没有资料可以参考，这个技术选型方案被放弃，选择了一个普遍用的一个方法，webpack+react。
尝试webpack+react
我选用webpack后发现配置简单的让我吃惊，很顺利的把代码开发和编译部署结合起来了，代码一切ｏｋ，我觉得我可以很顺利的进入开发了，但是实际开发中才发现react并不是想象中的那么好用，给我带来了一些很麻烦的事情。
项目开发
js名称
我在开发中一直喜欢用xxx-xxx.js的格式，但是在配置打包路径时，我只能用xxXxx.js,而使用 xxx-xxx.js直接打包报错，我只能把握项目习惯用得蛇形命名替换成驼峰命名。
push加载
我就踩过一个坑，我的列表用push载入的，再使用render渲染后，我发无论使用props,还是state都无法去给push渲染出来的组件赋值，后面是采用React.findDOMNode，去改变实际dom，同时去改变虚拟dom的值的做法，虽然最后解决问题，但是感觉很麻烦。
数据传递和改变组件
我看重react的特性之一，可以像vm对页面组件化，但是你一个页面划分多个组件就存在数据传递的问题，比如我的A页面引入了B1,B2,B1页面又引入了Ｃ１，我如果Ｃ１的变化改变Ｂ１的数据，我可以用Ｂ１页面传递个方法到Ｃ１，Ｃ１回调Ｂ１的方法就好了，但是如果我Ｂ２去改变Ｃ１时就很难做了，后面我不的采取和上面问题一样的方法去做。
无限滑动组件
因为react事件出发方式和目前主流的控件都不一样，我只能去翻git,找了个React 无限滑动组件，我找了个用的最多的组件，发现他在我的android和电脑上表现都不错，最后开发结束到测试时候，发现在iphone上表现不流畅，但是react组件太少了，很多成熟插件因为框架设计思想上的问题都不能用。
编译出来的js过大
我最终上线的js每一个都９００Ｋ以上，觉得太大了。
技术总结
在各种和坑对抗的工作中，项目终于顺利上线，性能和后期维护上显示出了他的优势，但是遇到的问题也不少，选择react会颠覆一些开发理念，原来感觉很简单的，在react变得复杂（比如数据事件传递），而一些以前处理感觉麻烦的事情变得简单（用数据去改变dom）。