如何获取新数据以响应Redact的React Router更改？ [英] How to fetch the new data in response to React Router change with Redux?

问题描述

我正在使用Redux，redux-router和reactjs。

I'm using Redux, redux-router and reactjs.

我正在尝试创建一个应用程序来获取有关路由更改的信息，所以，我类似于：

I'm trying to make an app where I fetch information on route change, so, I've something like:

<Route path="/" component={App}>
    <Route path="artist" component={ArtistApp} />
    <Route path="artist/:artistId" component={ArtistApp} />
</Route>

当有人进入 artist /< artistId> 我想搜索艺术家，然后呈现信息。问题是，这是最好的方法吗？

When someone enters to artist/<artistId> I want to search for the artist and then render the information. The question is, what it's the best way of doing this?

我找到了一些关于它的答案，使用RxJS或尝试使用中间件来管理请求。现在，我的问题是，这真的是必要的还是仅仅是一种保持架构反应不可知的方法？我可以从react componentDidMount（）和componentDidUpdate（）获取我需要的信息吗？现在我通过触发请求信息的函数中的动作来执行此操作，并在信息到达时重新呈现组件。该组件有一些属性让我知道：

I've found some answers about it, using RxJS or trying a middleware to manage the requests. Now, my question is, Is this really necessary or just a way to keep the architecture react-agnostic? Can I just fetch the information I need from react componentDidMount() and componentDidUpdate() instead? Right now I'm doing this by triggering an action in those functions that request information and the component re-renders when the information has arrived. The component has some properties for letting me know that:

{
    isFetching: true,
    entity : {}
}

谢谢！

推荐答案

现在，我的问题是，这真的是必要的还是只是一种保持架构反应不可知的方法？我可以从react componentDidMount（）和componentDidUpdate（）获取我需要的信息吗？

Now, my question is, Is this really necessary or just a way to keep the architecture react-agnostic? Can I just fetch the information I need from react componentDidMount() and componentDidUpdate() instead?

你可以完全用 componentDidMount（）和 componentWillReceiveProps（nextProps）。

这是我们在 real Redux中的-world 示例：

You can totally do that in componentDidMount() and componentWillReceiveProps(nextProps).
This is what we do in real-world example in Redux:

function loadData(props) {
  const { fullName } = props;
  props.loadRepo(fullName, ['description']);
  props.loadStargazers(fullName);
}

class RepoPage extends Component {
  constructor(props) {
    super(props);
    this.renderUser = this.renderUser.bind(this);
    this.handleLoadMoreClick = this.handleLoadMoreClick.bind(this);
  }

  componentWillMount() {
    loadData(this.props);
  }

  componentWillReceiveProps(nextProps) {
    if (nextProps.fullName !== this.props.fullName) {
      loadData(nextProps);
    }

  /* ... */

}

你可以用Rx更复杂，但根本不需要。

You can get more sophisticated with Rx, but it's not necessary at all.

这篇关于如何获取新数据以响应Redact的React Router更改？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！