The ability to reply to discussions is limited to PRO members. Want to join in the discussion? Click here to subscribe now.

Reflux - Loading data with Superagent

Reflux - Loading data with Superagent

5:05
Neither React nor Reflux come with a built-in library for loading data. Many people use jQuery, but this jQuery is heavy for the task. In this lesson, John shows you how to easily load in some data using Superagent and walks you through the process of displaying and formatting the data in your component.
Watch this lesson now
Avatar
egghead.io

Neither React nor Reflux come with a built-in library for loading data. In this video, John shows you how to easily load in some data using Superagent and walks you through the process of displaying and formatting the data in your component.

Avatar
Srihari

How can i render this using NOT es6/babel and with lodash.. i am trying:

var Name = React.createClass({
    mixins:[Reflux.connect(store)],
    render: function(){
        return(
            <div>
            {_.map(this.state.users,function(n){
                fName=n.user.name.first
                lName=n.user.name.last
                picture = n.user.picture.thumbnail;
                return ""+fName+" "+lName + " " + picture
            })
            }
                </div>
        )
    }
});

i am connecting to randomUser Api. the issue im having is that i can't render line breaks between elements, and therefore can't render img src=linktoImage properly as well, it just shows the URL for respective image.

Avatar
Ignacio Morales

superagent documentation change a little bit, right now you need to get the request first and then handle it. that's why the example doesn't work properly if you have the latest superagent version.

To fixed, just change the init call to something like this:

init() {
var that = this;
request.get('https://output.jsbin.com/dekafa.json')
.set('crossOrigin', 'true')
.end(function(err, res){
console.log(this);
that.data.people = JSON.parse(res.text);
that.trigger(that.data);
});
},

Avatar
Ben

Correct me I'm wrong, his example is a bit confusing. Using react-router, the store won't get initiated when the concerned component is called after a route change

I'm sure there's a good explanation to it, but this tut' seems to be tied to a very specific context

Avatar
Martin Genev

hi, great video, how do i use the connect to store mixin with es6 class syntax?

HEY, QUICK QUESTION!
Joel's Head
Why are we asking?