Question

我是vue的新手（从vue 2开始），我在使用Store（vuex），并试图实现某些目标。基本上，我设法安装了vue-auth插件：我有这个$ .auth，可以从.vue文件中调用。现在使用商店，我想通过从vue文件分派这样的调用来调用userLogin函数：

<script>
export default {
  computed: {
    comparePasswords() {
      return this.password === this.passwordConfirm
        ? true
        : "Passwords don't match";
    }
  },
  methods: {
    userSignUp() {
      if (this.comparePasswords !== true) {
        return;
      }
      this.$store.dispatch("userSignUp", {
        email: this.email,
        password: this.password
      });
    }
  },
  data() {
    return {
      email: "",
      password: "",
      passwordConfirm: ""
    };
  }
};
</script>

在商店/索引中，我试图访问“ this。$ auth”，但我确实了解它是某种上下文切换，但是我不知道如何访问vue应用程序实例。：

import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)
let app = this
export const store = new Vuex.Store({
  state: {
    appTitle: 'LiveScale Dashboard',
    user: null,
    error: null,
    loading: false
  },
  mutations: {
    setUser(state, payload) {
      state.user = payload
    },
    setError(state, payload) {
      state.error = payload
    },
    setLoading(state, payload) {
      state.loading = payload
    }
  },
  actions: {
    userLogin({ commit }, payload) {

      commit('setLoading', true)

      var redirect = this.$auth.redirect(); // THIS IS WRONG.
      this.$auth.login({                 // THIS IS WRONG. 
        body: payload, // Vue-resource
        data: payload, // Axios
        rememberMe: this.data.rememberMe,
        redirect: { name: redirect ? redirect.from.name : 'account' },
        fetchUser: this.data.fetchUser
      })
        .then(() => {
          commit('setUser', this.context)
          commit('setLoading', false)
          router.push('/home')
        }, (res) => {
          console.log('error ' + this.context);
          commit('setError', res.data)
          commit('setLoading', false)

        });
    },
    userSignUp({ commit }, payload) {
       // ...
    }
  },
  getters: {}
})

感谢您的帮助

Answer 1

（到目前为止）的想法是将实例作为参数传递给函数，如下所示：

Person.Name = someNameVariable

，然后在 store->操作中， payload.auth 将包含我的auth插件：

  this.$store.dispatch("userSignUp", {
    email: this.email,
    password: this.password,
    auth: this.$auth  //added this line
  });

我不知道这是否是最佳实践，但这就是我设法做到的。请随时提出任何建议。

Answer 2

尝试在index.js中使用Vue.$auth

从非Vue文件访问Vue应用程序（此）

2 个答案: