Call an API using superagent?

Question

I have an API that consists this branch of data

{
  "data": {
    "id": ,
    "title": ,
    "description": ,
    "old_price": "100",
    "new_price": "50",
    "size": "50",
    "quantity": 20,
  },
  "errors": null,
  "code": 1
}

I am using superagent in order to call the API and render this information, but I am doing it in wrong way.

Here my code

import React from 'react';
import {render} from 'react-dom';
import superagent from 'superagent';
import Layout from './components/Layout';

class App extends React.Component{
  constructor(){
    super()
    this.state={
      name:''
    }
  }
    componentDidMount(){
        console.log('componentDidMount');

        const url='http://...';
        superagent
        .get(url)
        .query(null)
        .set('Accept', 'application/json')
        .end ((error, response)=>{
            const title=response.body.response
            console.log(JSON.stringify(title));
            
            this.setState({
              name:title
            })
        })
        
    }
  render(){
    return(
      <Layout data={this.state}/>
    )
  }
}


render(<App />, document.getElementById('app'));

Here I render it

import React from 'react';

export default class Layout extends React.Component{
    render(){
        let data = this.props.data;
        return (
            <div> 
                 {data.name}
            </div>
        )
    }
}

But is not rendering, I think I am doing in wrong way. Please could you help me with that.

score 2 · Accepted Answer · answered Nov 08 '16 at 14:37

2

const title=response.body.response

Should be

const title=response.body

most likely

answered Nov 08 '16 at 14:37

Shiroo

666
4
11

Hey, thank u it worked! of course, I did some couple of adjustments, but this was a starting point) – Feruza Nov 09 '16 at 05:49

score 1 · Answer 2 · answered Nov 08 '16 at 14:13

For me something like this is working:

import request from 'superagent';

getFooFromServer() {
  const url='http://...';
  request.get(`${url}/foo`)
    .accept('json')
    .then(res => {
      //Do something with your data
    }
    catch(error => {
      //Do something with the error
    };
}

Call an API using superagent?

2 Answers2