一、前言
路由嵌套,即在当前路由中注册子路由,形成父子路由,并在父路由中显示子路由对应的组件。子路由内也可以注册它的子路由,一直下去就可以形成一个庞大的“路由家族”。
简单来说,就是在一个路由的页面下,继续使用路由加载新的组件;可以将嵌套路由理解为父子路由,常见的多导航界面通常就是由多层嵌套的组件组合而成。
嵌套路由还有一个优点,就是让新的页面内容展示在父组件的占位符(即router-view标签)中,这样有利于页面结构的搭建,结构清晰。
那么,如何注册子路由呢?
Vue路由定义中需要用到一个children属性,其值为数组,数组中的每一项对应一个子路由。
二、码上谈兵
示例代码如下:
<template id="tmpl">
<div>
<h1>这是 Account 组件</h1>
<router-link to="/account/login">登录</router-link>
<router-link to="/account/register">注册</router-link>
<router-view></router-view>
</div>
</template>
路由配置文件如下:
routes: [
{
path: '/account',
component: account,
// 使用 children 属性,实现子路由,同时,子路由的 path 前面,不要带 / ,否则永远以根路径开始请求,这样不方便去理解URL地址
children: [
{ path: 'login', component: login },
{ path: 'register', component: register }
]
}
// { path: '/account/login', component: login },
// { path: '/account/register', component: register }
]
还可以优化以上处理逻辑,在home路由对应的组件加载到页面时,若需要默认加载一个子路由时,可以做一个重定向,在home路由中redirect:"重定向的子路由网址"。这个时候加载home页面时默认会加一个子路由。
代码:默认显示home2
{
path:"/home",
name:"home",
component:()=>import('../views/home/index.vue'),
redirect:"/home/home2",//当网址为/home时重定向到/home/home2
children:[
{
path:"home1",
name:"home1",
component:()=>import('../views/home/home1/index.vue')
},
{
path:"home2",
name:"home2",
component:()=>import('../views/home/home2/index.vue')
},
{
**ES6**
* 列举常用的ES6特性:
* 箭头函数需要注意哪些地方?
* let、const、var
* 拓展:var方式定义的变量有什么样的bug?
* Set数据结构
* 拓展:数组去重的方法
* 箭头函数this的指向。
* 手写ES6 class继承。

**微信小程序**
* 简单描述一下微信小程序的相关文件类型?
* 你是怎么封装微信小程序的数据请求?
* 有哪些参数传值的方法?
* 你使用过哪些方法,来提高微信小程序的应用速度?
* 小程序和原生App哪个好?
* 简述微信小程序原理?
* 分析微信小程序的优劣势
* 怎么解决小程序的异步请求问题?

**其他知识点面试**
* webpack的原理
* webpack的loader和plugin的区别?
* 怎么使用webpack对项目进行优化?
* 防抖、节流
* 浏览器的缓存机制
* 描述一下二叉树, 并说明二叉树的几种遍历方式?
* 项目类问题
* 笔试编程题:

#### 最后
技术栈比较搭,基本用过的东西都是一模一样的。快手终面喜欢问智力题,校招也是终面问智力题,大家要准备一下一些经典智力题。如果排列组合、概率论这些基础忘了,建议回去补一下。
**开源分享:https://docs.qq.com/doc/DSmRnRGxvUkxTREhO**