首页 > react把多个组件connect到store还是紧紧通过props来传递数据?

react把多个组件connect到store还是紧紧通过props来传递数据?

开发项目时,我通常是把每个组件都通过connect订阅store,然后取出想要的数据传到每个组件的props里面。而官方文档中似乎鼓励不要把多个组件订阅到store,通过组件去传递数据。

请帮忙分析一下这两种方式


楼主说的这种方式应该是flux。
就我个人来说,需要单例的地方才会用store,否则用props,打个比方:
用户信息这个是全站单例的,这里需要用store来传递。
而普通列表则不需要,如果普通列表使用store订阅数据,会发现一个很奇葩的问题,组件unmount之后,store的数据未清除,下次再mount的时候有历史数据,


我不知道你们说的方法是什么方法,不过我习惯这样写
https://github.com/chunmu/dowork/blob/master/components/MusicHome.js


个人认为对store太多的监听注册会导致性能下降,因此除非一些相当独立的模块,其他情况最好还是通过props来传递,而且随着项目推进深入,你应该也会感觉到把相关的数据放到同一个store中使用起来也更加方便

对于独立的模块,我现在的项目里面就有个例子,我需要对一大组字符串进行搜索匹配,input框被我放在了一个modal里,以便在页面上任何时候都可以调用,所以这个input框被我直接封装起来并注册到了“一大组字符串”所保存的store里。其他的时候我基本都还是在最顶层(我把它叫做appFrame)中引入store,并通过props传递


  1. 都知道 React 核心讲的是单向数据流和渲染的确定性,流的确定性当然来自流的源头(the source of truth)。所以应该减少流的源头,这才符合 React 的架构设计

  2. 在 React 中有 container component (smart) 和 normal component (dummy) 两个概念。 能够知晓 store 的就是 smart 组件。 normal component 去除了和 store 的耦合更加独立,更符合 pure render 的函数式思维。基于此也应尽量设计少的 smart component,更多的 normal component。

【热门文章】
【热门文章】