文章/答案/技术大牛

发布

社区首页 >问答首页 >TypeError: this.$route.push不是函数vue.js，并且未捕获TypeError:无法读取未定义的属性“”push“”

问TypeError: this.$route.push不是函数vue.js，并且未捕获TypeError:无法读取未定义的属性“”push“”
EN

Stack Overflow用户

提问于 2018-11-16 22:44:06

回答 2查看 17K关注 0票数 6

我得到了一个类似"TypeError: this.$route.push不是一个函数“的错误，即使我也尝试了ES6来绑定它，仍然不起作用。每当我点击about.vue中的“获取主页数据”按钮时，它应该会重定向到主页。是有效的，但是在这里我需要调用ajax，并且在ajax响应之后，它必须重定向，，，所以我没有使用

router.js

import Vue from "vue";
import Router from "vue-router";
import Home from "../components/Home/Home.vue";
import About from "../components/About.vue";
import FallBackPage from "../components/FallBackPage/FallBackPage.vue";
import MyOrders from "../components/MyOrders/MyOrders.vue";

 Vue.use(Router);

export function createRouter() {
  return new Router({
  mode: "history",
  routes: [
   { path: "/", component: Home },
   { path: "/about", component: About },
   { path: "/myorders", component: MyOrders },
   { path: "/*", component: FallBackPage }
  ]
 });
}

main.js

 import Vue from "vue";
 import App from "./App.vue";
 import { createRouter } from "./router/router.js";

  export function createApp() {

   const router = createRouter();

   const app = new Vue({
      router,
      render: h => h(App)
  });

 return { app, router };
 }

about.vue

 <template>
  <div>
    {{ aboutText }}
     <button  @click="gobackToHome">Get Homepage Data</button>
  </div>
</template>
<script>
export default {
   data() {
    return {
      aboutText: "About Component"
    };
  },
  method: {
     gobackToHome: function() {

        this.$route.push("/")

   // $route or $router both are not working


    }

    // gobackToHome: () => {
      //  this.$route.push("/")
     // }

   }

};
</script>

vue.js

vuejs2

vuex

vue-router

回答 2

Stack Overflow用户

回答已采纳

发布于 2018-11-19 17:37:05

更改路由的步骤

 this.$router.push({ path: '/' })
 this.$router.push({ name: 'Home' })

//main.js

import Vue from "vue";
import App from "./App.vue";
import VueRouter from "vue-router";
import { routes } from "./router/router";

Vue.use(VueRouter);
export function createApp() {
  const router = new VueRouter({
    mode: "history",
    routes
   });

  const app = new Vue({
    router,
    render: h => h(App)
  }).$mount("#app");

  return { app, router };
}

//routes.js

 import Home from "../components/Home/Home.vue";
 import About from "../components/About.vue";
 import FallBackPage from "../components/FallBackPage/FallBackPage.vue";
 import MyOrders from "../components/MyOrders/MyOrders.vue";

 export const routes = [
   { path: "/", component: Home },
   { path: "/about", component: About },
   { path: "/myorders", component: MyOrders },
   { path: "/*", component: FallBackPage }
 ]

在main.js更改以更改路由的基础上，我们需要使用以下内容

 this.$router.push({ path: '/' })
 this.$router.push({ name: 'Home' })

票数 1

Stack Overflow用户

发布于 2018-11-17 04:40:43

我认为问题在于你没有将vue-router导入到你的应用程序中。只需导入到router.js中，然后您就不必将所有的router.js导入到您的应用程序中，只需导入createRouter函数即可。试试这个：

//routes.js

import Home from "../components/Home/Home.vue";
import About from "../components/About.vue";
import FallBackPage from "../components/FallBackPage/FallBackPage.vue";
import MyOrders from "../components/MyOrders/MyOrders.vue";

export const routes [
   { path: "/", component: Home },
   { path: "/about", component: About },
   { path: "/myorders", component: MyOrders },
   { path: "/*", component: FallBackPage }
  ]




//main.js
import Vue from 'vue'
import App from './App.vue'
import VueRouter from 'vue-router'
import {routes} from './routes'

Vue.use(VueRouter)

const router = new VueRouter({
  mode: 'history',
  routes
})

new Vue({
      router,
      render: h => h(App)
  }).$mount('#app')

然后在您的组件中使用this.$router.push("/")

票数 5

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/53340049

复制

相似问题

问TypeError: this.$route.push不是函数vue.js，并且未捕获TypeError:无法读取未定义的属性“”push“”
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问TypeError: this.$route.push不是函数vue.js，并且未捕获TypeError:无法读取未定义的属性“”push“”EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问TypeError: this.$route.push不是函数vue.js，并且未捕获TypeError:无法读取未定义的属性“”push“”
EN