在大家做新项目时毫无疑问会出现发生动态路由:

举例说明:

一个种类的产品网页页面会出现类似不一样的产品就需要在路由器的后边加一个id;

Vue的路由器id是那样加上的:

二种动态路由

一种是params主要参数加上:

最先如今Index.js加上id

 {
    path: "/user/:id",
    component: User
  }

随后再关联Id

 <router-link :to="'/user/' dataid" tag="button">客户</router-link>

大家如何动态性获得这一id呢?

this.$route.params.id

也有一种是query主要参数路由器:

 <router-link :to="{path:'/proflie',query:{name:'雷荣',height:1.88,age:18}}" tag="button">我的</router-link>

立即就改为那样,无需配备哪些id

动态路由或是十分的简易的;下面便是懒加载学了

懒加载

什么叫懒加载?

大家能看官方网文本文档怎么解释

 

 

 就是在我们装包时,全部的js都装包在一起,在页面加载的情况下会看起来更为的费劲,因此就想想一个方法能不能在应用某一部件的情况下就载入某一js,别的的不启用,“用时即载入”。

定义了解后,Vue如何完成这一作用呢?

 //立即懒加载
const User = () => import('../components/User.vue')
const Home = () => import('../components/Home.vue')
const About = () => import('../components/About.vue')

便是那么简易;立即将之前引入部件的地区改为那样就可以了

随后便是

嵌入路由器

上编码一看就知:

{
    path: '/home',
    component: Home,

    children: [
      {
        path: '/',
        redirect: 'message'
      },
      {
        path: 'message',
        component: HomeMessage
      },
      {
        path: 'news',
        component: HomeNews
      }

便是在主路由器里加上children,留意:这儿的path能够无需写‘/’

未完待续。。。

 

评论(0条)

刀客源码 游客评论