0

I'm using axios to make a get request to embed.rocks. Inorder to have the axios get request to embed.rock work I have to wrap it in a setTimeout function:

loadLink: function() {
            this.status = "Loading...";
            this.show = true;

            setTimeout(function() {

                var axios2 = axios.create();
                delete axios2.defaults.headers.common['X-CSRF-TOKEN'];
                delete axios2.defaults.headers.common['X-Requested-With'];

                axios2({
                        method: 'get',
                        url: 'https://api.embed.rocks/api?url=' + this.url,
                        headers: {
                            'x-api-key': 'my-key'
                        }
                    })
                    .then(function(response) {
                        console.log(response);
                        app.url = response.data.url;

                        this.title = response.data.title;
                        this.description = response.data.description;

                        if (app.post_type === "video") {
                            this.thumbnail = response.data.oembed.thumbnail_url;
                        }

                        if (app.post_type === "article") {
                            this.thumbnail = response.data.images[0].url;
                        }

                        app.submitted = '';

                    })
                    .catch(function(error) {
                        app.status = "There was an error" + error;
                    });
            }.bind(this))

        }

As you can see when I get the response from embed.rocks I am trying to update these data properties:

data() {
        return {
            submitted: false,
            thumbnail: '',
            title: '',
            description: '',
        }
    },

I get the response logged out in the console, but the data properties won't set. How do I set those data properties in a timed out request?

Edit I forgot to add that this is all being done in a component.

user3325126
  • 1,284
  • 4
  • 15
  • 36
  • You have to bind the axios callbacks the same way you bind the setTimeout callback if you're going to use `this` in the axios callbacks. Or just use fat arrows, or use a closure. – Bert Jul 08 '18 at 01:55
  • Ahh okay, like this: https://stackoverflow.com/questions/45216998/accessing-vue-jss-data-from-axios Thank you – user3325126 Jul 08 '18 at 02:49

0 Answers0