Question

27

How to fetch the new data in response to React Router change with Redux?

rated 0 times [ 28] [ 1] / answers: 1 / hits: 23428 / 9 Years ago, tue, september 29, 2015, 12:00:00

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>

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?

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 : {}

}

Thanks!

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

jadyngraysons

Add To Favorites

Follow

Total Points: 455

Total Questions: 109

Total Answers: 98

Location: Trinidad and Tobago

Member since Fri, May 8, 2020

4 Years ago

jadyngraysons questions

1 AWS Lambda SNS Destinations not working on failure or success

Fri, Aug 14, 20, 00:00, 4 Years ago

1 React Hooks useState Array empty with states rendered in the component

Tue, May 5, 20, 00:00, 4 Years ago

1 postman pm set environment variable

Thu, Apr 23, 20, 00:00, 4 Years ago

1 getElementById after dynamically adding it in React

Sat, Jan 18, 20, 00:00, 4 Years ago

1 How to customise Intl.DateTimeFormat date?

Tue, Dec 31, 19, 00:00, 4 Years ago

View All

answered 9 Years ago elijahm · Accepted Answer

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?

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);

    }



  /* ... */



}

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