[vue学习]route/index.js两种引入页面的方式

2019-07-16  本文已影响0人  音无级鹦鹉螺号szhiku

第一种是页面自带的引入方式:
index.js代码:

import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld'
import Demo1 from '@/pages/demo1/index.vue' //from后面是文件路径,@是根目录vue

Vue.use(Router)

export default new Router({
  routes: [
    {
      path: '/',
      name: 'HelloWorld',
      component: HelloWorld
    },
    {
      path: '/demo1',
      name: 'demo1',
      component: Demo1 //和第4行的Demo1一致
    }
  ]
})

第二种是使用require函数(该方法有些编辑器不会有代码提示):
index.js代码:

import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld'
import Demo1 from '@/pages/demo1/index.vue'

Vue.use(Router)

export default new Router({
  routes: [
    {
      path: '/',
      name: 'HelloWorld',
      component: HelloWorld
    },
    {
      path: '/demo1',
      name: 'demo1',
      component: Demo1
      // component: require("@/pages/demo1/index.vue")
    }
  ]
})
上一篇 下一篇

猜你喜欢

热点阅读