Warning: file_get_contents(/data/phpspider/zhask/data//catemap/5/sql/81.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Vuejs2 vuejs vue路由器:类型错误:无法读取属性';推动';未定义的_Vuejs2_Vue Router - Fatal编程技术网

Vuejs2 vuejs vue路由器:类型错误:无法读取属性';推动';未定义的

Vuejs2 vuejs vue路由器:类型错误:无法读取属性';推动';未定义的,vuejs2,vue-router,Vuejs2,Vue Router,我无法使用vue路由器加载页面。似乎未连接到我的$routervar 当我记录控制台日志this.$router时,我收到一个未定义的消息。但是,console logging此返回开发工具中的存储对象 以下是相关脚本: main.js import Vue from "vue"; import VueCookies from 'vue-cookies'; import App from "./App.vue"; import router from "./router"; import { s

我无法使用vue路由器加载页面。似乎未连接到我的
$router
var

当我记录控制台日志
this.$router
时,我收到一个未定义的消息。但是,console logging
返回开发工具中的存储对象

以下是相关脚本:

main.js

import Vue from "vue";
import VueCookies from 'vue-cookies';
import App from "./App.vue";
import router from "./router";
import { store } from "./store/store";
import BootstrapVue from "bootstrap-vue";
import "./registerServiceWorker";
import "bootstrap/dist/css/bootstrap.css";
import "bootstrap-vue/dist/bootstrap-vue.css";
import "../css/bracket.min.css";

Vue.use(BootstrapVue);
Vue.use(VueCookies);

// set default config
VueCookies.config('1d');

// set global cookie
VueCookies.set('theme','default');
VueCookies.set('hover-time','1s');

require("../css/bracket.min.css");

Vue.config.productionTip = false;

new Vue({
  router,
  store,
  render: h => h(App)
}).$mount("#app");
import Vue from "vue";
import Router from "vue-router";
// import Home from "@/views/Home.vue";
import Splash from "@/components/Splash.vue";
import Dash from "@/components/Dash.vue";
import Signup from "@/views/Signup.vue";
import finalSignup from "@/components/finalSignup.vue";
import providerDash from "@/views/ProviderDash.vue";
import employeeDash from "@/views/EmployeeDash.vue";
import Login from "@/views/Login.vue";

Vue.use(Router);

export default new Router({
  mode: "history",
  base: process.env.BASE_URL,
  routes: [
    {
      path: "/",
      name: "home",
      component: Splash
    },
    {
      path: "/login",
      name: "login",
      component: Login
    },
    {
      path: "/signup",
      name: "signup",
      component: Signup
    },
    {
      path: "/provider-full-name",
      name: "finalSignup",
      component: finalSignup
    },
    {
      path: "/provider-dashboard",
      name: "providerDash",
      component: providerDash
    },
    {
      path: "/employee-dashboard",
      name: "employeeDash",
      component: employeeDash
    },
    {
      path: "/about",
      name: "about",
      component: () =>
        import(/* webpackChunkName: "about" */ "./views/About.vue")
    }
  ]
});
router.js

import Vue from "vue";
import VueCookies from 'vue-cookies';
import App from "./App.vue";
import router from "./router";
import { store } from "./store/store";
import BootstrapVue from "bootstrap-vue";
import "./registerServiceWorker";
import "bootstrap/dist/css/bootstrap.css";
import "bootstrap-vue/dist/bootstrap-vue.css";
import "../css/bracket.min.css";

Vue.use(BootstrapVue);
Vue.use(VueCookies);

// set default config
VueCookies.config('1d');

// set global cookie
VueCookies.set('theme','default');
VueCookies.set('hover-time','1s');

require("../css/bracket.min.css");

Vue.config.productionTip = false;

new Vue({
  router,
  store,
  render: h => h(App)
}).$mount("#app");
import Vue from "vue";
import Router from "vue-router";
// import Home from "@/views/Home.vue";
import Splash from "@/components/Splash.vue";
import Dash from "@/components/Dash.vue";
import Signup from "@/views/Signup.vue";
import finalSignup from "@/components/finalSignup.vue";
import providerDash from "@/views/ProviderDash.vue";
import employeeDash from "@/views/EmployeeDash.vue";
import Login from "@/views/Login.vue";

Vue.use(Router);

export default new Router({
  mode: "history",
  base: process.env.BASE_URL,
  routes: [
    {
      path: "/",
      name: "home",
      component: Splash
    },
    {
      path: "/login",
      name: "login",
      component: Login
    },
    {
      path: "/signup",
      name: "signup",
      component: Signup
    },
    {
      path: "/provider-full-name",
      name: "finalSignup",
      component: finalSignup
    },
    {
      path: "/provider-dashboard",
      name: "providerDash",
      component: providerDash
    },
    {
      path: "/employee-dashboard",
      name: "employeeDash",
      component: employeeDash
    },
    {
      path: "/about",
      name: "about",
      component: () =>
        import(/* webpackChunkName: "about" */ "./views/About.vue")
    }
  ]
});
userSession.js(vuex模块)

-正在讨论的操作名为
authenticateUserSession

import Axios from "axios";

const userSession = {
  namespaced: true,
  state: {
    email: '',
    password: ''
  },
  mutations: {
    SET_EMAIL: (state, payload) => {
      state.email = payload;
    },
    SET_PASSWORD: (state, payload) => {
      state.password = payload;
    }
  },
  actions: {
    setEmail(context, email) {
      context.commit('SET_EMAIL', email)
    },
    setPassword(context, password) {
      context.commit('SET_PASSWORD', password)
    },
    authenticateUserSession(context, {email, password}) {
      context.dispatch('setEmail', email);
      context.dispatch('setPassword', password);
      Axios.post('http://localhost:3000/api/v1/sessions', {}, {
        headers: {
          'Accept': 'application/json',
          'Content-Type': 'application/json',
          'user-email': context.state.email,
          'user-password': context.state.password
        }
      })
      .then((response) => {
        // console.log(response.data.locals.token);
        // console.log(this.$router);
        // console.log(this);

        let jwt = response.data.locals.token
        window.$cookies.set('jwt', jwt);
        this.$router.push("home");
      })
      .catch(function(error) {
        console.log(error);
      })
    }
  },
  getters: {
    getEmail: (state) => {
      return state.email;
    },
    getPassword: (state) => {
      return state.password;
    }
  }
}
export default userSession;

为什么我无法访问vue路由器变量(
$router/this.$router
)&无法呈现指定的路由?

除了帖子中的其他链接外,@yuriy636链接中的内容帮助我解决了这个问题

我最后做了以下几件事:

import router from "../../router"; 
.
.
.

// inside the authenticateUserSession action, in axios response
router.push("home")";  
非常感谢@yuriy636