vue.js - vue-router定义路由只有路由发生改变界面并没有跳转

问题描述

问 题

我就直接上代码吧 首先是main.js文件路口

import Vue from 'vue'
import App from './App'
import VueResource from 'vue-resource'
import VueRouter from 'vue-router'
import router from './router.js'
// import MyHome from './pages/MyHome'

/* eslint-disable no-new */
Vue.use(VueRouter)
Vue.use(VueResource)

new Vue({
  el: '#app',
  template: '<App/>',
  components: { App },
  router
})

其次是router.js文件

import VueRouter from 'vue-router'
import MyHome from './pages/MyHome'
import NotFound from './pages/NotFound'
// import Hello from './components/Hello.vue'

const routes = [{
  name: 'home', path: '/home', component: MyHome
}, {
  name: 'errpage', path: '*', component: NotFound
}]
const router = new VueRouter(
  routes
)
export default router

然后再是MyHome.vue文件

<template>

    <div>
      新的登录界面
    </div>

</template>

<script>
export default {
  name: 'my-home',
  data () {
    return {

    }
  }
}
</script>

<style scoped>

</style>

求大神解答 有没有什么问题？

解决方案

<!-- 路由匹配到的组件将渲染在这里 -->
<router-view></router-view>
你可有这个？

这篇关于vue.js - vue-router定义路由只有路由发生改变界面并没有跳转的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！