【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. 理解:valuefunction,用于处理客户端提交的请求
    2. .工作过程:服务器接收到一个请求时,根据请求路径找到匹配的函数来处理请求,返回响应数据
  2. 前端路由

    1. 理解:valuecomponent ,用于展示页面内容
    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=
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值