No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search
    1. Home
    2. synbits
    S
    • Profile
    • Following 0
    • Followers 0
    • Topics 4
    • Posts 19
    • Best 7
    • Groups 0

    synbits

    @synbits

    12
    Reputation
    365
    Profile views
    19
    Posts
    0
    Followers
    0
    Following
    Joined Last Online

    synbits Follow

    Best posts made by synbits

    • RE: Quasar v0.15 Roadmap

      @all https://www.patreon.com/quasarframework to get things going

      posted in Announcements
      S
      synbits
    • RE: v0.15 news

      Docs are looking good m8!!! https://github.com/quasarframework/quasar-framework.org/tree/dev/source/guide

      posted in Announcements
      S
      synbits
    • RE: [Solved] resizing image in <q-select>

      I do it in the scope and add classname for this in qselect

      posted in Help
      S
      synbits
    • RE: v0.15 news

      *High five!

      posted in Announcements
      S
      synbits
    • Use Plugin inside Vuex module action

      When using the Vuex modules I was trying to use the axios plugin from inside the actions of this module.
      I use the axios plugin with settings the way as described in docs.
      I then have namespaced vuex modules, and inside the actions I can’t reach the this.$axios

      What am I overlooking?
      Or am I wrong and do I need to perform my axios calls in my vue files?

      Axios plugin (axios.js):

      import axios from 'axios'
      
      export default ({ Vue }) => {
        //Vue.prototype.$axios = axios
        Vue.prototype.$axios = axios.create({
            baseURL: 'https://api.app.eu'
          }
        })
      }
      

      Store setup (store/index.js)

      import Vue from 'vue'
      import Vuex from 'vuex'
      
      import auth from './module-auth'
      
      Vue.use(Vuex)
      
      const store = new Vuex.Store({
        modules: {
          auth
        }
      })
      
      export default store
      

      Vuex module - index (store/module-auth/index.js)

      import state from './state'
      import * as getters from './getters'
      import * as mutations from './mutations'
      import * as actions from './actions'
      
      export default {
        namespaced: true,
        state,
        getters,
        mutations,
        actions
      }
      

      Vuex module Auth - actions (store/module-auth/actions.js)
      !!This is where this.$axios is not found

      import { Notify, Loading } from 'quasar'
      /*
      export const someAction = (state) => {
      }
      */
      export const doLogin = (state,creds) => {
        state.commit('LOGIN')
        let email=creds.email
        let password=creds.password
        console.log(this.$axios)
        return this.$axios
          .post('/auth/signin', {
            email,
            password
          })
          .then(r => {
            //console.log(r)
            //localStorage.setItem("token", "JWT");
            commit('LOGIN_SUCCESS')
            return r
          })
          .catch(e => {
            //console.log(e.response)
            Notify.create("Error: " + e.response.status)
            //localStorage.removeItem("token")
            commit('LOGOUT')
            return e
          })
      }
      
      export const doLogout = (state) => {
        localStorage.removeItem("token")
        commit(LOGOUT)
      }
      

      Trying to dispatch it in one of my vue files:

        methods: {
        	login () {
        		this.$store.dispatch("doLogin", {
        			email: this.email,
        			password: this.password
        		})
        	}
        },
      
      posted in Help
      S
      synbits
    • RE: v0.15 news

      One link to rule them all: http://quasar-framework.org/support-quasar-framework.html

      posted in Announcements
      S
      synbits
    • RE: v0.15 news

      Again, using docs through github, they are really good! They work perfect for me! Good job!

      posted in Announcements
      S
      synbits

    Latest posts made by synbits

    • RE: Use Plugin inside Vuex module action

      I could add this to the payload of dispatch, but is this the correct aproach?

      this.$store.dispatch("auth/doLogin", {
        			email: this.email,
        			password: this.password,
              that: this
        		})
      
      posted in Help
      S
      synbits
    • Use Plugin inside Vuex module action

      When using the Vuex modules I was trying to use the axios plugin from inside the actions of this module.
      I use the axios plugin with settings the way as described in docs.
      I then have namespaced vuex modules, and inside the actions I can’t reach the this.$axios

      What am I overlooking?
      Or am I wrong and do I need to perform my axios calls in my vue files?

      Axios plugin (axios.js):

      import axios from 'axios'
      
      export default ({ Vue }) => {
        //Vue.prototype.$axios = axios
        Vue.prototype.$axios = axios.create({
            baseURL: 'https://api.app.eu'
          }
        })
      }
      

      Store setup (store/index.js)

      import Vue from 'vue'
      import Vuex from 'vuex'
      
      import auth from './module-auth'
      
      Vue.use(Vuex)
      
      const store = new Vuex.Store({
        modules: {
          auth
        }
      })
      
      export default store
      

      Vuex module - index (store/module-auth/index.js)

      import state from './state'
      import * as getters from './getters'
      import * as mutations from './mutations'
      import * as actions from './actions'
      
      export default {
        namespaced: true,
        state,
        getters,
        mutations,
        actions
      }
      

      Vuex module Auth - actions (store/module-auth/actions.js)
      !!This is where this.$axios is not found

      import { Notify, Loading } from 'quasar'
      /*
      export const someAction = (state) => {
      }
      */
      export const doLogin = (state,creds) => {
        state.commit('LOGIN')
        let email=creds.email
        let password=creds.password
        console.log(this.$axios)
        return this.$axios
          .post('/auth/signin', {
            email,
            password
          })
          .then(r => {
            //console.log(r)
            //localStorage.setItem("token", "JWT");
            commit('LOGIN_SUCCESS')
            return r
          })
          .catch(e => {
            //console.log(e.response)
            Notify.create("Error: " + e.response.status)
            //localStorage.removeItem("token")
            commit('LOGOUT')
            return e
          })
      }
      
      export const doLogout = (state) => {
        localStorage.removeItem("token")
        commit(LOGOUT)
      }
      

      Trying to dispatch it in one of my vue files:

        methods: {
        	login () {
        		this.$store.dispatch("doLogin", {
        			email: this.email,
        			password: this.password
        		})
        	}
        },
      
      posted in Help
      S
      synbits
    • RE: Axios settings/defaults 0.15

      Thank you!

      posted in Help
      S
      synbits
    • Axios settings/defaults 0.15

      Hello,

      In 0.15 where to place the axios defaults?
      For example:

      defaults.baseURL = ‘https://api.somewhere.com’
      or
      the defaults.headers.common[‘x-custom-token’] = ‘i1’

      Where should I put this in the new pwa structure?

      Thanks

      posted in Help
      S
      synbits
    • RE: Vuex use Quasar Loading

      Ok, roger that!

      posted in Help
      S
      synbits
    • RE: Quasar v0.15 is out!

      Woooohooooow! Good job!

      posted in Announcements
      S
      synbits
    • RE: v0.15 news

      Again, using docs through github, they are really good! They work perfect for me! Good job!

      posted in Announcements
      S
      synbits
    • Vuex use Quasar Loading

      Hello,

      I have modules in a Vuex store.
      During the mutations I have states changing, with a pending state to show a Loading spinner.
      Where do I listen to the state to change and show or hide the loading?

      In any .vue file? How?
      Or can I do it inside the vuex module?

      This is my idea now inside a .vue file:

      <script>
      import { Loading } from 'quasar'
      export default {
        name: 'PageLogin',
        data () {
        	return {
        		email:"",
        		password: ""
        	}
        },
        watch: {
          runLoading: () => {
            if(this.runLoading){
            	Loading.show()
            }else{
            	Loading.hide()
            }
          }
        },
        methods: {
        	login () {
        		console.log(this.$store)
        		this.$store.dispatch("auth/doLogin", {
        			email: this.email,
        			password: this.password
        		}).then(() => {
        			this.$router.push("/")
        		}).catch((res) => {
        			console.log(res)
        		})
        	}
        },
        computed: {
          runLoading () {
            return this.$store.state.auth.pending
          }
        }
      }
      </script>
      
      posted in Help
      S
      synbits
    • RE: v0.15 news

      Docs are looking good m8!!! https://github.com/quasarframework/quasar-framework.org/tree/dev/source/guide

      posted in Announcements
      S
      synbits
    • RE: Released Quasar v0.14.8 and CLI v0.6.5

      High five

      posted in Announcements
      S
      synbits