Amadeus's blog Amadeus's blog
首页
  • 前端文章

    • JavaScript
    • Vue
    • TypeScript
    • 前端工程化
  • 学习笔记

    • 《JavaScript教程》笔记
    • 《ES6 教程》笔记
    • 《Vue》笔记
    • 《TypeScript 从零实现 axios》
    • 小程序笔记
  • HTML
  • CSS
  • stylus
  • 技术文档
  • GitHub技巧
  • Nodejs
  • 博客搭建
  • 口语
  • 音标
  • 语法
  • 简单
  • 中等
  • 困难
  • 20年10月
  • 20年11月
  • 20年12月
  • 21年01月
  • 21年02月
  • 21年03月
  • 21年04月
  • 21年05月
  • 21年06月
  • 21年07月
  • 21年08月
  • 21年09月
  • 21年10月
  • 21年11月
  • 21年12月
  • 22年01月
  • 22年02月
  • 22年03月
  • 22年04月
  • 22年05月
  • 22年06月
  • 22年07月
  • 22年08月
  • 22年09月
  • 21年3月
  • 知识笔记
  • 22年5月
  • 22年8月
  • 22年9月
  • 学习
  • 书法
  • 面试
  • 音乐
  • 驾照
  • 深度强化学习
  • 心情杂货
  • 友情链接
关于
  • 网站
  • 资源
  • Vue资源
  • 分类
  • 标签
  • 归档
GitHub (opens new window)

Amadeus

起风了,唯有努力生存!
首页
  • 前端文章

    • JavaScript
    • Vue
    • TypeScript
    • 前端工程化
  • 学习笔记

    • 《JavaScript教程》笔记
    • 《ES6 教程》笔记
    • 《Vue》笔记
    • 《TypeScript 从零实现 axios》
    • 小程序笔记
  • HTML
  • CSS
  • stylus
  • 技术文档
  • GitHub技巧
  • Nodejs
  • 博客搭建
  • 口语
  • 音标
  • 语法
  • 简单
  • 中等
  • 困难
  • 20年10月
  • 20年11月
  • 20年12月
  • 21年01月
  • 21年02月
  • 21年03月
  • 21年04月
  • 21年05月
  • 21年06月
  • 21年07月
  • 21年08月
  • 21年09月
  • 21年10月
  • 21年11月
  • 21年12月
  • 22年01月
  • 22年02月
  • 22年03月
  • 22年04月
  • 22年05月
  • 22年06月
  • 22年07月
  • 22年08月
  • 22年09月
  • 21年3月
  • 知识笔记
  • 22年5月
  • 22年8月
  • 22年9月
  • 学习
  • 书法
  • 面试
  • 音乐
  • 驾照
  • 深度强化学习
  • 心情杂货
  • 友情链接
关于
  • 网站
  • 资源
  • Vue资源
  • 分类
  • 标签
  • 归档
GitHub (opens new window)
  • TypeScript笔记

  • 前端工程化

  • 面试

    • 简历
    • 面试
    • 前端体系
    • 八股文
    • HTML5面试题
    • CSS3面试题
    • JavaScript基础面试题
    • JavaScript高级面试题
    • 前端工程化面试题
    • Vue2面试题
    • Vue全家桶
    • 小程序

    • Vue3源码解析

    • 设计模式

    • NestJS笔记

    • JavaScript文章

    • Vue文章

    • 学习笔记

    • 前端
    • 面试
    Amadeus
    2023-09-05
    目录

    Vue全家桶

    # Vue全家桶

    # 1.Vue基础

    1.Vue的特点

    2.MVVM

    3.SPA

    4.v-show和v-if的区别

    5.key的作用

    6.computed和method的区别

    7.双向绑定和v-model的本质

    8.data选项

    9.data属性的更新,视图是否立刻同步执行重新渲染

    10.sass是什么,在vue中如何安装和使用

    11.vue配置跨域

    12.v-if和v-for

    13.keep-alive的了解

    14.Vue插槽的作用和实际运用

    # 2.Component组件

    1.生命周期

    2.组件通讯

    # 3.Composition API

    1.什么是Composition API和Options API

    2.Composition API和Options API的区别

    3.Vue3中setup函数的作用

    4.ref和reactive的区别

    ref可以包裹任意数据类型,reactive只能包裹复杂数据类型

    ref返回ref对象,需要通过value属性获取值

    reactive直接取就行

    5.Composition API常见的函数和用法

    6.watch和watchEffect的区别

    7.Vue3中常见语法糖

    # 4.Vue Router路由

    1.两种路由模式

    hash、history

    2.路由跳转时如何传递数据

    template中通过$route.params

    created中通过this.$route.params

    setup中通过vue-router提供的hook,useRoute()

    3.什么时路由守卫?作用是什么?

    作用:1.检查token判断用户是否登录

    2.对用户权限进行判断

    3.记录页面的某些信息,比如记录页面的滚动信息等

    4.route和router的区别

    route是路由信息对象,vue3总通过useRoute获取,包含各种属性

    router是路由实例对象,包含各种方法

    # 5.Vuex和Pinia状态管理

    store

    state

    getters

    actions

    mutations

    modules

    Pinia没有mutations和modules

    # 6.Vue其他问题

    1.什么是虚拟DOM,什么是diff算法

    模拟真实DOM的JS对象,使用JS操作就能实现DOM操作

    diff算法通过同层的树节点进行比较的高校算法,深度优先,同层比较。精准定位变化前后的差异节点进行局部更新。

    2.vue2和vue3响应性原理

    Vue2用的数据劫持和发布订阅者模式

    3.nextTick方法的实现原理

    使用了Promise

    4.Proxy与Object.defineProperty对比

    defineProperty只能劫持对象属性,对于新增的属性需要重新进行劫持,否则新属性不具有响应性

    Proxy直接代理对象,新属性依旧具有响应性

    5.Vue SSR

    SSR: 在服务端进行html的渲染并直接返回给客户端

    好处:更好的SEO,更快的内容到达时间(首屏加载更快)

    坏处:服务器负载更大

    6.Vue项目优化

    代码层面优化:v-if和v-show区分使用

    computed和watch区分使用

    v-for必须添加key

    长列表性能优化

    打包层面优化:webpack对图片进行压缩

    减少ES6转为ES5的冗余代码

    其它优化:

    7.Vue首屏加载优化

    把不常改变的库放到index.html中,并使用CDN提速

    Vue路由懒加载,Vue组件不要全局引入

    使用轻量级工具库

    减少首页的资源请求数,减少资源的大小

    避免使用大图,图片使用懒加载

    8.Vue3中Proxy替代defineProperty的原因

    defineProperty劫持的是对象属性,无法对新属性自动的进行响应式。Proxy是劫持整个对象。

    # 7.Axios网络请求库

    基于Promise的AJAX库

    # 8.Vue VS React

    编辑 (opens new window)
    Vue2面试题
    小程序开发

    ← Vue2面试题 小程序开发→

    最近更新
    01
    最长递增子序列
    04-21
    02
    非递减子序列
    04-21
    03
    全排列
    04-21
    更多文章>
    Theme by Vdoing | Copyright © 2020-2024 Amadeus | MIT License
    • 跟随系统
    • 浅色模式
    • 深色模式
    • 阅读模式