【vue面试-精简篇2】http分类有哪些，http五大分类有什，vue2路由，跳转几种方式并怎么传参，http和https有什么区别，组件的通信方式 ,directive自定义指令

http分类有哪些，http五大分类有什么

Type	Reason-phrase	Note
1XX	Informational	信息性状态码，表示接受的请求正在处理
2XX	Success	成功状态码，表示请求正常处理完毕
3XX	Redirection	重定向状态码，表示需要客户端需要进行附加操作
4XX	Client Error	客户端错误状态码，表示服务器无法处理请求
5XX	Server Error	服务器错误状态码，表示服务器处理请求出错

vue2路由

路由分类

1. 后端路由

   1. 理解:value是function，用于处理客户端提交的请求
   2. .工作过程:服务器接收到一个请求时，根据请求路径找到匹配的函数来处理请求，返回响应数据

2. 前端路由

   1. 理解:value是component ，用于展示页面内容
   2. 工作过程:当浏览器的路径改变时，对应的组件就会显示

active-class 可配置高亮样式

<router-link to="/index" active-class="active">选中后的颜色</router-link>

跳转几种方式，怎么传参

1.声明式-router-link

 < router-link to="/me"> 我的 < /router-link>
  < router-link to="//me?id=15265"> 我的 < /router-link>
  < router-link to="//me?id=  **:id** "> 我的 < /router-link>

2.函数式 this.$router.push(‘/me’)

不带参数

this.$router.push('/home')
this.$router.push({
   name:'home'})
this.$router.push({
   path:'/home'})

带参数

query传参

query相当于GET请求，页面跳转的时候，可以在地址栏看到请求参数
uery传参**

this.$router.push({
   name:'home',query: {
   id:'1'}})
this.$router.push({
   path:'/home',query: {
   id:'1'}})

// html 取参  $route.query.id
// script 取参  this.$route.query.id

params传参

params相当于POST请求，参数不会在地址栏中显示

his.$router.push({
   name:'home',params: {
   id:'1'}})  // 只能用 name

// 路由配置 path: "/home/:id" 或者 path: "/home:id" ,
// 不配置path ,第一次可请求,刷新页面id会消失，配置path,刷新页面id会保留

// html 取参  $route.params.id
// script 取参  this.$route.params.id

使用path方式跳转路由 path会忽略params 所以path不能和params一起使用
推荐使用name和params方式实现路由跳转

// 字符串，不带参数
this.$router.push('home')

// 对象，不带参数
this.$router.push({
    path: 'home' })

// params（推荐）：命名的路由，params 必须和 name 搭配使用
this.$router.push({
    name:'user',params: {
    userId: 123 }})

// 这里的 params 不生效
this.$router.push({
    path:'/user',params: {
    userId: 123 }})

// query：带查询参数，变成 /register?plan=private
this.$router.push({
    path: 'register', query: {
    plan: 'private' }})

//meta方式：路由元信息
export default new Router({
   
    routes: [
        {
   
            path: '/user',
            name: 'user',
            component: user,
            meta:{
   
                title:'个人中心'
            }
        }
    ]
})

通过 $route 对象获取，注意是route，没有r ,不是router
this.$route.params
this.$route.query
this.$route.meta

3.this.$router.replace()

this.$router.replace('/home')
this.$router.replace({
   name:'home'})
this.$router.replace({
   path:'/home'})

4.this.$router.go(n)

向前或者向后跳转n个页面，n可为正整数或负整数1

this.$router.go(-1)  // 返回上一页
this.$router.go(1)  //前进一页

5.也算跳转但不能指定跳转

this.$router.back() // 返回上一页
this.$router.forwarp()  //前进一页

route和router的区别

$route : 路由信息对象，只读对象

$router : 是路由操作对象，只写对象

http和https有什么区别

1、安全性——https比http 多一层 ssl协议的存在，会对网站与客户端之前传输的数据进行加密，不存在数据泄露的问题。

2、响应速度——理论上，http响应速度更快，这是因为http只需三次握手，也就是3个包即可建立连接， 而https除了三次握手，还需进行ssl握手，一共需要12个包。

3、端口——http和https采用两种完全不同的连接方式，前者采用的是80端口，后者则是443端口。

4、消耗资源——https是构建在SSL之上的http协议，所以https会 消耗更多 的服务器资源。

5、费用不同——https需为网站购买和配置ssl证书，会产生一定的费用。

6、展示方式——http会被浏览器标记 不安全字样 https则会被标记 安全字样

组件的通信方式

1.父传子

在Vue.component（）{}中，加入与template、data同级的props用来接受传值
.

父组件

//父组件
<template>
  <div>
    <h1>{
   {
    title }}</h1>
    <h1>{
   {
    titleted }}</h1>
                                         <!--    传入字符串-->
    <SonView @getMessage="showMsg" sontitleted="sontitleted" /> 
                                          <!--    传入变量-->
    <SonView @getMessage=