How to insert params in the fetch url in React Native?

Question

My skills in React Native is basic, i want to insert the params id in the url to show the posts according to the category.

export default class PostByCategory extends Component {
   static navigationOptions = ({ navigation }) => ({
    title: `${navigation.state.params.Title}`,
    });

  constructor(props) {
    super(props);
    this.state = {
      isLoading: true,
    };
  }

  componentDidMount() {

   return fetch(ConfigApp.URL+'json/data_posts.php?category='`${navigation.state.params.IdCategory}`)
     .then((response) => response.json())
     .then((responseJson) => {
       this.setState({
         isLoading: false,
         dataSource: responseJson
       }, function() {
       });
     })
     .catch((error) => {
       console.error(error);
     });
 }

I resolve it by replacing the `${navigation.state.params.IdCategory} with + this.props.navigation.state.params.IdCategory — bdroid, Apr 14 '18 at 12:31

score 0 · Answer 1 · answered Apr 14 '18 at 12:34

componentDidMount() {

 return fetch(ConfigApp.URL+'json/data_posts.php?category='+this.props.navigation.state.params.IdCategory)
 .then((response) => response.json())
 .then((responseJson) => {
   this.setState({
     isLoading: false,
     dataSource: responseJson
   }, function() {
   });
 })
 .catch((error) => {
   console.error(error);
  });
}

score 0 · Accepted Answer · answered Apr 14 '18 at 16:25

You have to replace navigation.state.params.IdCategory with this.props.navigation.state.params.IdCategory.

It's not a good practice to manually concat your params to the url. I suggest you look at this question to learn how to properly construct your query string.

How to insert params in the fetch url in React Native?

2 Answers2