Vue和React的使用场景和深度有何不同
发布网友
共1个回答
热心网友
首先，其实Vue也完全可以全量赋值的，唯一需要的小优化就是给v-repeat列表一个track-by属性，提示一下如何判断两个对象是否是同一份数据。如果是没有复杂交互的列表，可以直接track-by="$index"原地复用DOM元素。合理使用track-by的情况下，Vue甚至可以比React更快（这里渲染的是100*5的数据表，每一帧都是全量新数据赋值）：dbmon(Vue)dbmon(react)在超大量数据的首屏渲染速度上，React有一定优势，因为Vue的渲染机制启动时候要做的工作比较多，而且React支持服务端渲染。需要指出的一点：React的VirtualDOM也不是不需要优化的。复杂的应用里你有两个选择1.手动添加shouldComponentUpdate来避免不需要的vdomre-render；2.Components尽可能都用pureRenderMixin，然后采用Flux结构+Immutable.js。其实也不是那么简单的。相比之下，Vue由于采用依赖追踪，默认就是优化状态：你动了多少数据，就触发多少更新，不多也不少。说起Flux架构，FB提供的标准实现非常繁琐，所以社区的各种造轮子版本层出不穷，目前其实还没有找到一个公认的最佳实践，而且大部分新Flux实现都引入了很多函数式概念，你如果对函数式编程不熟悉，光搞清楚那些概念就得花很久。如果你真的理解了Flux，你又会发现其实Vue也是可以应用Flux架构的。比如optimizely/nuclear-js·GitHub是一个Flux变种，他们就是同时把这个东西用在了React和Vue上面。再谈谈开发风格的偏好：React推荐的做法是JSX+inlinestyle，也就是把HTML和CSS全都整进JavaScript了。Vue的默认API是以简单易上手为目标，但是进阶之后推荐的是使用webpack+vue-loader的单文件组件格式：依然是熟悉的HTML和CSS，但是可以放在一个文件里。而且你还可以使用你想要的预处理器，比如LESS,Jade,Coffee,Babel，都可以。然后扯一扯模板vs.JSX的问题。JSX在逻辑表达能力上虽然完爆模板，但是很容易写出凌乱的render函数，不如模板看起来一目了然。当然这里也有个人偏好的问题。React的社区/组件生态比Vue大很多，这个是很显然的。不过说实话我很少见到现成的第三方组件完全符合我的要求。最后，使用场景上来说：React配合严格的Flux架构，适合超大规模多人协作的复杂项目。理论上Vue配合类似架构也可以胜任这样的用例，但缺少类似Flux这样的官方架构。小快灵的项目上，Vue和React的选择是开发风格的偏好。对于需要对DOM进行很多自定义操作的项目，Vue的灵活性优于React。---更新：楼下有些回答说Vue的核心是MVVM双向绑定，然后就直接跳跃到了『不适合持续工程迭代』的结论。且不说这样的跳跃太草率，这样的看法本身对于双向绑定的理解也是有偏差的。表单的双向绑定，说到底不过是（value的单向绑定+onChange事件侦听）的一个语法糖，你如果不想用v-model，像React那样处理也是完全可以的。另一方面，组件间的数据传递，Vue默认是单向的，和React一样。React本身并不存在所谓的『单向数据流』，这完全是Flux引入的概念。其核心还是在于避免组件的localstate，强调把state抽取出来进行集中的管理。没有Flux的情况下React一样会有状态难以管理的问题，其根源在于在哪里存放和管理state，和双向绑定没有本质联系。那难道Vue就不能这样管理状态吗？当然是可以的，Vue现在可以通过egoist/revue·GitHub和Rex进行配合，也可以用Vue专属的状态管理架构Vuex:vuejs/vuex·GitHub，『单向数据流』并没有React吹的那么神，直接因为这一点就觉得Vue不适合工程迭代，完全站不住脚。
