我应该在组件中使用redux(connect)中的状态还是从父组件传递道具?

时间:2017-11-24 17:59:33

标签: javascript reactjs redux

显然我不再使用本地状态,因为我的状态现在包含在Redux容器中。

但对于无状态组件,我只需使用props传递他们需要的数据。

我想验证这是O.K。?

下面是一个无状态组件的示例,该组件从其父级接收数据并将数据传递给它的子级。

父元素正在使用Redux。 (未显示)。

这方面有一个很好的参考吗?即文件?

import React from 'react';
import FrameFaveTagFave from './FrameFaveTagFave.jsx';

const FrameFaveTag = function(props) {
  const bookmarks = props.bookmarks.map((bookmark) =>
    <FrameFaveTagFave bookmark={bookmark} key={bookmark.id} />
  );
  return (
    <div className="bookmark_page" id="{props.tag}" >
      <div className="bookmark_tag_title">
        <p className="bookmark_tag_title_p">
          {props.tag}
        </p>
      </div>
      {bookmarks}
    </div>
  )
}

export default FrameFaveTag;

1 个答案:

答案 0 :(得分:1)

这取决于您遵循的惯例。每当我制作应用程序时,我都希望将状态保存在redux中,这些状态与应用程序的多个部分相关。假设您在应用程序为用户帐户的信息,权限信息等安装时提取数据,我更喜欢那些放入我的redux状态,我可以在应用程序的任何位置访问该状态。但是假设一个只对某个组件有意义的状态,我想把它放在组件的状态中。一个示例可以是您打开/关闭模态或第三个窗格等的位置。您也可以将其置于redux状态,但将其置于React组件的状态中是有意义的。如果您想在应用程序中将所有内容都设为功能组件,您可能还需要查看recompose及其实用程序方法。来自redux作者的This回复将为您提供更多有关何时应该在应用程序中将状态存储在redux中的信息。

修改

如果我们是否应该在组件中使用connect或从父级传递道具之间进行比较,那么我倾向于使用passing from parent稍微优于连接,因为虽然{{ 1}}使一个组件只监听组件的相关状态变化然后重新渲染它还必须进行比较检查是否与该组件相关的状态是否已经改变。