Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Usage inside vue-resource interceptor #6

Open
franc014 opened this issue Sep 15, 2016 · 4 comments
Open

Usage inside vue-resource interceptor #6

franc014 opened this issue Sep 15, 2016 · 4 comments

Comments

@franc014
Copy link

Hi,
I'm using vue-resource and I'd like to use vue-spinner inside interceptors to show/hide the spinner on any ajax request. I don't know if it's possible to reference a vue-spinner component inside the interceptor. I have done the following but with no success: (I'm using vueify)

var PulseLoader = require('vue-spinner/dist/vue-spinner.min').PulseLoader;

Vue.http.interceptors.push((request, next) => {
    this.loading = true;
   next((response) => {
        this.loading = false;
    });
});

new Vue({
    el: '#grid-manager',
   components: { 'pulse-loader': PulseLoader},

  ....and in the root vue instance i have:

<pulse-loader :loading="loading" :color="color" :size="size"></pulse-loader>

Thanks!
@patrickbolle
Copy link

Did you get this figured out?

@franc014
Copy link
Author

franc014 commented Dec 2, 2016

Not yet @patrickbolle I think i'm going to use other options like this one http://ricostacruz.com/nprogress/

@victorwpbastos
Copy link
Contributor

I guess this in the interceptor is in context of interceptor, not the vue main instance.

@catalsdevelop
Copy link

a good solution is to use a global mixin like

Vue.mixin({
	data() {
		return {
			loading: false
		}
	}
})

then loading is a reactive property and can be used in interceptors

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@victorwpbastos @franc014 @catalsdevelop @patrickbolle