路由分析（重要知识点）

1.路由内置方法

        $route：一般获取路由的信息【路径url、query、params等等】

        $router：一般进行编程式导航进行路由跳转【push、replace】

2.路由跳转方法

        声明式导航router-link

        编程式导航push、replace

3.路由元信息

        可以通过配置路由元信息，应对不同需求的页面

        meta里的数据可以根据不同页面进行分配

4.路由传参  （重点）

        两种参数

        params：属于路径当中的一部分。需要注意，在配置路由的时候，需要占位

        占位形式   /search/:keyword

        query：不属于路径当中的一部分，url?k=v  不需要占位

第一种：字符串形式

this.$router.push("/search/" + this.keyword + "?k=" + this.keyword)

        问号前为params参数

        问号后为query参数

第二种：模板字符串

this.$router,push(`/search/${this.keyword}?k=${this.keyword}`)

第三种：对象形式    注意对象形式只能使用name属性，不能使用path属性进行跳转

this.$router.push({name:"search",params:{keyword},query:{keyword}})

路由传参相关面试题

1.路由传递参数（对象写法）path是否可以结合params参数一起使用？

        答：不可以，在路由跳转的过程中，params参数不能通过path形式传递，否则将会报错

2.如何指定params参数可传可不传？

        答：在配置路由的时候，占位了（params参数），但是路由跳转时不传递，此时路径会出现问题，因此我们需要在配置params参数占位时，在后面加上一个?，这样params参数就为一个可选状态

        即为    /search/:keyword?

3.params参数可以传递也可以不传递，但是如果传递是空串，如何解决？

        答：正常情况下路径也会出现问题，此时我们可以使用undefined解决，路由跳转时可以这样写：this.$router.push({name:'search',params:{keyword:' ' || undefined}})

4.路由组件能不能传递props数据？

        答：可以，同时有三种写法

{
    path:"/search/:keyword?",
    component:Search,
    meta:{show:true},
    name:"search",
    //布尔值
    props:true
    //对象
    props:{a:1,b:2}
    //函数
    props:($route)=>{
        return {keyword:$route.params.keyword,k:$route.query.k}    
    }
}

仅供学习参考...