Vue 面试面经总结

最新推荐文章于 2024-04-14 05:53:10 发布
最新推荐文章于 2024-04-14 05:53:10 发布
阅读量1.6k 收藏 22
点赞数 7
分类专栏： 面试面经 vue 文章标签： vue 面试
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45828332/article/details/114119361
版权

Vue 面试面经总结

一、vue 组件通信方式？

  • Vue 的设计理念为单向数据流

1. 父子组件通信

1.1 prop
1.1.1 基本用法
<div id="app">
  <child :content="message"></child>
</div>

let Child = Vue.extend({
  template: `<h2>{{message}}</h2>`,
  props:{
    content:{
      type:String,
      default:() => {return 'form child'}
    }
  }
})

new Vue({
  el:'#app',
  data:{
    message:'form parent'
  },
  components:{
    Child
  }
})

// 结果
// form parent
1.1.2子组件接收形式（props）

  1. 数组形式

    props:['data1','data2',……,'datan']

  2. 简单对象形式

    props:{
  data1: Number,
  data1: String,
  data1: Boolean,
  data1: Function,
  data1: Object,
  data1: Array,
  data1: Symbol,
}

  3. 复杂对象形式

    props:{
  // 必传且是字符串
 propC: {
   type: String,
   required: true
 },
 // 数字，有默认值
 propD: {
   type: Number,
   default: 100
 },
 // 数组/对象的默认值应当由一个工厂函数返回
 propE: {
   type: Object,
   default: function () {
     return { message: 'hello' }
   }
 },
 // 自定义验证函数
 propF: {
   validator: function (value) {
     return value > 10
   }
 }
}

2. 子父组件通信

2.1 $emit
<div id="app">
  <my-button @receive="sayHi"></my-button>
</div>

let Child = Vue.extend({
  template: `<button @click="send()"></button>`,
  data(){
    return {
      msg:'vue.js'
    }
  },
  methods:{
    send(){
      this.$emit('receive',this.msg)
    }
  }
})

new Vue({
  el:'#app',
  components:{
    MyButton
  },
  methods:{
    sayHi(val){
      console.log('Hi,'+val)
    }
  }
})

// 结果
// Hi,vue.js

3. 兄弟组件通信

二、请你说说你知道的vue

1. vue是什么？

1.1 基本介绍

Vue.js（/vjuː/，或简称为Vue）

是一个用于创建用户界面的开源JavaScript 渐进式框架，也是一个创建单页面应用的Web应用框架

同时也是一款流行的JavaScript前端框架，旨在更好的组织与简化Web开发。Vue所关注的核心是MVC模式中的视图层，同时，它也能方便地获取数据更新，并通过组件内部特定的方法实现视图与模型的交互

1.2 主要功能
  • 模板渲染/数据同步
  • 组件和模块化
  • 拓展功能：路由等待
1.3 补充：
1.3.1 渐进式框架

就是框架分层，最核心的是视图层渲染，然后往外是组件机制，在此基础上再加入路由机制，再加入状态管理，最外层是构建工具

优势：根据不同的需求选择不同的层级

代表含义：主张最少

理解：不做除自己职责之外的事

1.3.2 单页面应用

单页Web应用，就是只有一张Web页面的应用。浏览器一开始会加载必需的HTML、CSS和JavaScript，之后所有的操作都在这张页面完成，这一切都由JavaScript来控制。

优点

  1. 良好的交互体验

    用户不需要从新刷新页面，获取数据也是通过Ajax异步获取

  2. 良好的前后端工作分离模式

  3. 减轻服务器压力

    服务器只用出数据就可以，不用管展示逻辑和页面合成

  4. 共用一套后端程序代码

缺点
  1. 首次加载大量资源
  2. 对搜索引擎不友好
  3. 开发难度较高

2. Vue核心特性

2.1 数据驱动（MVVM）

MVVM表示的是 Model-View-ViewModel

  • Model 数据模型，负责数据存储
  • View 视图，负责页面的显示
  • VM 负责业务处理，对数据进行加工，之后交给视图

2.2 组件化
2.2.1 什么是组件化

把图形、非图形的各种逻辑抽象为一个统一的概念（组件）来实现开发模式，在vue中每一个 .vue 文件都可以视为一个组件

2.2.2 组件化的优势
  • 降低整个系统的耦合度，在保持接口不变的情况下，我们可以替换不同的组件快速完成需求
  • 调试方便
  • 提高可维护性，对代码优化可获得系统的整体提升
2.3 指令系统

指令是带有 v- 前缀的特殊属性

作用：当表达式的值改变时，将其产生的连带影响响应式地作用于DOM

常用指令：

  • 条件渲染指令 v-if
  • 列表渲染指令 v-for
  • 属性绑定指令 v-bind（:）
  • 事件绑定指令 v-on（@）
  • 双向数据绑定指令 v-model

三、请你说说vue的生命周期?

1. beforeCreate 创建vue实例之前

  • $el为undefined

在new一个vue实例后，只有一些默认的生命周期钩子和默认事件，其他的东西都还没创建。在beforeCreate生命周期执行的时候，data和methods中的数据都还没有初始化。不能在这个阶段使用data中的数据和methods中的方法

2. created 创建实例成功

  • 一般在这里实现数据的异步请求
  • $el为undefined

data 和 methods都已经被初始化好了，如果要调用 methods 中的方法，或者操作 data 中的数据，最早可以在这个阶段中操作

3. beforeMount 挂载前

  • el为object

执行到这个钩子的时候，在内存中已经编译好了模板了，但是还没有挂载到页面中，此时，页面还是旧的

4. mounted 挂载后

执行到这个钩子的时候，就表示Vue实例已经初始化完成了。此时组件脱离了创建阶段，进入到了运行阶段。 如果我们想要通过插件操作页面上的DOM节点，最早可以在和这个阶段中进行

5. beforeUpdate 更新前

当执行这个钩子时，页面中的显示的数据还是旧的，data中的数据是更新后的， 页面还没有和最新的数据保持同步

6. updated 更新后

页面显示的数据和data中的数据已经保持同步了，都是最新的

7. beforeDestroy 销毁前

Vue实例从运行阶段进入到了销毁阶段，这个时候上所有的 data 和 methods ， 指令， 过滤器 ……都是处于可用状态。还没有真正被销毁

8. destroyed 销毁后

这个时候上所有的 data 和 methods ， 指令， 过滤器 ……都是处于不可用状态。组件已经被销毁了

9. 试题：

9.1 什么是生命周期？

Vue 实例从创建到销毁的过程，就是生命周期。从开始创建、初始化数据、编译模板、挂载Dom→渲染、更新→渲染、销毁等一系列过程，称之为 Vue 的生命周期

9.2 vue生命周期的作用是什么？

它的生命周期中有多个事件钩子，让我们在控制整个Vue实例的过程时更容易形成好的逻辑

9.3 vue生命周期总共有几个阶段？

它可以总共分为8个阶段：创建前/后, 载入前/后,更新前/后,销毁前/销毁后

9.4 第一次页面加载会触发哪几个钩子？

会触发 下面这几个beforeCreate, created, beforeMount, mounted

9.5 DOM 渲染在 哪个周期中就已经完成？

DOM 渲染在 mounted 中就已经完成了

四、vue请求数据放在created好还是mounted里好

建议放在created里
created:在模板渲染成html前调用，即通常初始化某些属性值，然后再渲染成视图。
mounted:在模板渲染成html后调用，通常是初始化页面完成后，再对html的dom节点进行一些需要的操作。

如果在mounted钩子函数中请求数据可能导致页面闪屏问题
其实就是加载时机问题，放在created里会比mounted触发早一点，如果在页面挂载完之前请求完成的话就不会看到闪屏了

五、请你说说vue中$nextTick用法及原理

1. 定义

在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM。

官方理解：Vue 实现响应式并不是数据发生变化之后 DOM 立即变化，而是按一定的策略进行 DOM 的更新。$nextTick 是在下次 DOM 更新循环结束之后执行延迟回调，在修改数据之后使用 $nextTick，则可以在回调中获取更新后的 DOM

个人理解：nextTick()，是将回调函数延迟在下一次dom更新数据后调用，即数据更新了，在dom渲染完成后调用该函数

2. 基本用法

<div class="app">
  <div ref="msgDiv">{{msg}}</div>
  <div v-if="msg1">{{msg1}}</div>
  <div v-if="msg2">{{msg2}}</div>
  <button @click="changeMsg">点击修改……</button>
</div>

new Vue({
  el: '.app',
  data: {
    msg: 'Hello world.',
    msg1: '',
    msg2: ''
  },
  methods: {
    /*
    * 通过 this.$refs.msgDiv.innerHTML 操作 ref="msgDiv" 指向的DOM
    */
    changeMsg() {
      this.msg = "Hello vue."
      // 调用了 this.$nextTick() 将会在下一次 DOM 更新之后执行（此时，msg已修改为Hello vue.且页面已更新完成）
      this.$nextTick(() => {
        //this.$refs.msgDiv.innerHTML = 'Hello vue.'
        this.msg1 = this.$refs.msgDiv.innerHTML
      })
      // 当点击时Dom还未更新，获取到的msgDiv.innerHTML仍然是未更新前页面上渲染的数据（Hello world.）
      // this.$refs.msgDiv.innerHTML = 'Hello world.'
      this.msg2 = this.$refs.msgDiv.innerHTML
    }
  }
})

/*
* 点击前：
* 		Hello world.
* 		点击修改……
* 
* 点击后：
* 		Hello world.
* 		Hello vue.
* 		Hello world.
* 		点击修改……
*/

3. 应用场景

  1. 在Vue生命周期的created()钩子函数进行的DOM操作一定要放在Vue.nextTick()的回调函数中

    在created()钩子函数执行的时候DOM 其实并未进行任何渲染

  2. 在数据变化后要执行的某个操作，而这个操作需要使用随数据改变而改变的DOM结构的时候，这个操作都应该放进Vue.nextTick()的回调函数中。

六、vue 中的 data为什么是函数?

1. 问题描述

为什么在vue组件中，我们的data属性必须是一个函数,new Vue()中的data除外，因为new Vue中只有一个data属性

2. 原因

因为我们能抽离出来的组件，肯定是具有复用性的，它在项目中会存在多个实例。如果data属性值是一个对象时，那么它所有的实例都会共享这些数据，这是很麻烦的事情，你不能确保你的所有实例中的属性值都不会重复，无论在哪个组件实例中修改data,都会影响到所有的组件实例

期望：每个组件都能独立维护自己的数据

3. 问题解决

  • 在JavaScript中，函数具有独立作用域快的特点，外部是无法访问其内部的变量
// 声明构造器函数
function Person() {}
Person.prototype.data = {
  // 原型下挂载一对象,并有name属性
  name: 'Hello World!',
};

var p1 = new Person();
var p2 = new Person();
p1.data.name = 'Hello Vue!';
console.log(p1.data.name); // Hello Vue!
console.log(p2.data.name); // Hello Vue!

此时原型下为一个对象，p1,p2均指向同一个实体

原型下的属性相当于公有的

修改一个实例对象下的属性也会造成另一个实例属性跟着改变，这样组件复用的时候，肯定是不行的，那么改成函数呢？

// 声明构造器函数
function Person() {
  this.data = this.data()
}
Person.prototype.data = {
  // 原型下挂载一对象,并有name属性
  name: 'Hello World!',
};

var p1 = new Person();
var p2 = new Person();
p1.data.name = 'Hello Vue!';
console.log(p1.data.name); // Hello Vue!
console.log(p2.data.name); // Hello World!

由此得出：若原型下为一个函数，根据函数具有独立作用域快的特点，完美地达到了每个组件都能独立维护自己的数据

同理，在vue中要想组件能到达复用的效果，data必须是一个函数

七、Vue的computed、watch、methods用法及其区别

1. Computed

1.1 定义

是一个计算属性,类似于过滤器,对绑定到view的数据进行处理

1.2 基本用法

computed:{ 属性名:function(){ return 返回值; } }

  • 在computed中定义的不是方法，而是属性
  • 计算属性在data中不用定义
<div id="app">
  <p>{{ list }}</p>
  <p>{{ sumList }}</p>
</div>

var app = new Vue({
  el: '#app',
  data: {
    list: [9,3,5,7]
  },
  computed: {
    // 计算属性的 getter
    sumList: function () {
      var sum = 0
      for(let i=0;i<=this.list;i++){
        sum = sum + list[i]
      }
      return sum
    }
  }
})
  1. 上述代码中的计算属性为sumList
  2. 计算属性执行的function中涉及到的数据量被称为计算属性的依赖数据
  3. 计算属性：当该属性的依赖数据发生变化时，则该属性会重新进行计算
  4. 计算属性执行的function中renturn的返回值是计算属性计算的最终结果
1.3 getter && setter

计算属性包含两个操作：

  1. getter，获取计算属性的结果，默认的function是获取结果（所以可以省略不写）。用get:function(){}实现。当依赖数据发生变化时会自动执行get函数。

  2. setter，设置计算属性的结果。用set:function(){}实现。当计算属性通过v-model绑定在表单元素上，用户对表单元素的值进行了修改时执行set函数。

    computed:{
  sumList:{
      get:function(){
          return 返回值
      },
      set:function(参数){
          
      }
  }
}

    // ...
computed: {
  fullName: {
    // getter
    // 回调函数 当需要读取当前属性值是执行，根据相关数据计算并返回当前属性的值
    get: function () {
      return this.firstName + ' ' + this.lastName
    },
    // setter
    // 监视当前属性值的变化，当属性值发生变化时执行，更新相关的属性数据
    // newValue :fullName的最新值
    set: function (newValue) {
      var names = newValue.split(' ')
      this.firstName = names[0]
      this.lastName = names[names.length - 1]
    }
  }
}
// ...

2. Watch

2.1 定义

watch 是一个观察的动作

2.2 基本用法
  • 当price值变化时，watch监听到并且执行
<div>
      <p>FullName: {{Price}}</p>
      <p>FirstName: <input type="text" v-model="price"></p>
</div>
 
new Vue({
  el: '#root',
  data: {
    price: '2',
    symbolUnit: '￥',
    Price:''
  },
  watch: {
    price(newName, oldName) {
      this.Price = newName + this.symbolUnit;
    }
  } 
})
2.3 handler 方法和 immediate 属性:
  • 当想让值在最初的时候watch就执行，可以使用 handler 方法和 immediate 属性
watch: {
  price: {
    handler(newName, oldName) {
      this.Price = newName + this.symbolUnit;
    },
    // 代表在wacth里声明了firstName这个方法之后立即先去执行handler方法，如果设置了false，那么效果和上边例子一样
    immediate: true
  }
}
2.4 deep属性
  • 深度监听，常用于对象下面属性的改变
<div>
      <p>obj.a: {{obj.a}}</p>
      <p>obj.a: <input type="text" v-model="obj.a"></p>
</div>
 
new Vue({
  el: '#root',
  data: {
    obj: {
      a: 123
    }
  },
  watch: {
    obj: {
      handler(newName, oldName) {
         console.log('obj.a changed');
      },
      immediate: true
    }
  } 
})

当我们在输入框中修改a的值时，发现watch是无效的

默认情况下，handler只监听obj这个属性引起的变化，我们只有给obj赋值的时候它才会监听到，而obj.a的改变无法监听

当需要监听 obj.a 时，需要使用 deep 属性

watch: {
  obj: {
    handler(newName, oldName) {
      console.log('obj.a changed');
    },
    immediate: true,
    deep: true
  }
}

而同时这种方法对性能影响很大，修改obj里面的任何一个方法都会触发这个监听器里的 handler

改进：

watch: {
  'obj.a': {
    handler(newName, oldName) {
      console.log('obj.a changed');
    },
    immediate: true,
    // deep: true
  }
}

3. computed 和 watch 的区别

3.1 computed
  1. 是计算值
  2. 具有缓存性，页面重新渲染值不会变化，计算属性会立即返回之前的计算结果，而不必再次执行函数（只有当依赖数据发生改变才会重新计算）
  3. 不支持异步，当computed内有异步操作时无效，无法监听数据的变化
3.2 watch

  1. 是观察的动作

  2. 无缓存性，页面重新渲染时值不变化也会执行（值改变则直接触发）

  3. 支持异步

  4. 监听数据必须是 data 中声明过或者父组件传递过来的props中的数据

4. computed 和 methods 的区别

区别一：

计算属性是基于它的依赖进行实时更新的，方法则是调用才更新

区别二：

计算属性是有缓存的，只要相关依赖没有改变，多次访问计算属性得到的值是之前缓存的计算结果，不会多次执行。操作一个没有依赖项的值也是如此。

任何一个方法都会触发这个监听器里的 handler

改进：

watch: {
  'obj.a': {
    handler(newName, oldName) {
      console.log('obj.a changed');
    },
    immediate: true,
    // deep: true
  }
}

3. computed 和 watch 的区别

3.1 computed
  1. 是计算值
  2. 具有缓存性，页面重新渲染值不会变化，计算属性会立即返回之前的计算结果，而不必再次执行函数（只有当依赖数据发生改变才会重新计算）
  3. 不支持异步，当computed内有异步操作时无效，无法监听数据的变化
3.2 watch

  1. 是观察的动作

  2. 无缓存性，页面重新渲染时值不变化也会执行（值改变则直接触发）

  3. 支持异步

  4. 监听数据必须是 data 中声明过或者父组件传递过来的props中的数据

4. computed 和 methods 的区别

区别一：

计算属性是基于它的依赖进行实时更新的，方法则是调用才更新

区别二：

计算属性是有缓存的，只要相关依赖没有改变，多次访问计算属性得到的值是之前缓存的计算结果，不会多次执行。操作一个没有依赖项的值也是如此。

八、vue 页面缓存怎么做？

程程.
关注
  • 7
    点赞
  • 踩
  • 22
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
前端H5面试题（vue为主）
qq_45656036的博客
06-24 1236
一.src和href的区别 ？ href标识超文本引用，用在link和a等元素上，href是引用和页面关联，是在当前元素和引用资源之间建立联系 src表示引用资源，表示替换当前元素，用在img，script，iframe上，src是页面内容不可缺少的一部分。 src用于替换当前元素， href 用于在当前文档和引用资源之间确立联系。 1、请求资源类型不同 2、 浏览器解析方式不同 3、作用结果不同 二.页面元素隐藏方式 和各自特点？ 第一种：display属性为none，效果：元素不
h5面试题总结
Sco_114的博客
08-16 4157
导航的解析流程 1.导航被触发。 2.在失活的组件里调用beforeRouteLeave守卫 3.调用全局的 beforeEach 守卫 4.在重用的组件里调用 beforeRouteUpdate 守卫 (2.2+) 5.在路由配置里调用 beforeEnter 6.解析异步路由组件 7.在被激活的组件里调用 beforeRouteEnter 8.调用全局的 beforeResolve 守卫 (2.5+) 9.导航被确认 10.调用全局的 afterEach 钩子 11.触发 DOM 更新 12.调用bef
vue面经
weixin_44199924的博客
10-26 994
vue生命周期的理解 总共分为8个阶段创建前/后，载入前/后，更新前/后，销毁前/后。 对Vue.js的template编译的理解 通过compile编译器把template编译成AST语法树（abstract syntax tree 即 源代码的抽象语法结构的树状表现形式），compile是createCompiler的返回值，createCompiler是用以创建编译器的。另外compile还负责合并option。然后，AST会经过generate（将AST语法树转化成render funtion字符串
VUE面试题汇总（九），2024年最新金三银四大厂面经总结
m0_60707708的博客
04-14 844
面试题千万不要死记，一定要自己理解，用自己的方式表达出来，在这里预祝各位成功拿下自己心仪的offer。网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。需要这份系统化的资料的朋友，可以添加V获取：vip1024c （备注前端）一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！
前端Vue基础面试精选总结
Rick_and_mode的博客
09-15 674
1、 响应式布局如何实现 2、 数据类型判断 3、 原型和原型链 4、 闭包 5、 js 继承 6、 什么是深拷贝，浅拷贝，如何实现 7、 事件冒泡，事件捕获 8、 h5 和css3 的新特性 9、 Axios 拦截做过哪些 10、 sessionStoragelocalStorage cookie 的区别 11、 图片懒加载实现原理 12、 解构赋值 13、 async/await 14、 es6 有哪些拓展 15、 请写出在vue 中使用promise 封装项目api 接口的思路？ 16、 promis
前端面经-Vue
qq_45723302的博客
08-31 759
1、双向绑定原理，手撕简单源码（vue响应式原理） Vue的双向数据绑定是通过数据劫持集合发布者订阅者模式来实现的
vue面试题，面试实例
12-31
为了帮助您更好地准备Vue面试，我们为您准备了这份全面的Vue面经文档。本文档涵盖了Vue的核心概念、技术要点、面试编程题等多个方面，旨在帮助您全面了解Vue面试的知识点和技巧。 在“技术要点”部分，我们详细介绍...
前端综合面经-html，css，js，vue全套面经
02-21
包含html，css，js，vue面经，以及性能优化面经及答案，还附有思维导图，接近千套面试题及答案
Vue面试资源 难度：中等
11-17
题目类型：Vue面试资源 难度：中等 覆盖范围：Vue基础知识、Vue组件通信、Vue路由、Vuex等。 1. 请简要介绍一下Vue的核心概念和特点。 2. Vue的生命周期钩子有哪些？它们分别在什么时候执行？ 3. 请解释一下Vue中的...
vue常见面试题及答案解析.txt 面经
12-26
vue常见面试题及答案解析.txt 面经 vue常见面试题及答案解析.txt 面经 vue常见面试题及答案解析.txt 面经
Vue面试题及Vue知识点整理
12-10
（都是一些基础的vue面试题，大神不用浪费时间往下看） 一、对于MVVM的理解？ MVVM 是 Model-View-ViewModel 的缩写。Model代表数据模型，也可以在Model中定义数据修改和操作的业务逻辑。View 代表UI 组件，它负责...
vue_mianmian:vue项目-pc前端面项目（源代码+数据库+总结）
03-22
vue_mianmian:vue项目-pc前端面项目（源代码+数据库+总结）
30 道 Vue 面试题，内含详细讲解（涵盖入门到精通，自测 Vue 掌握程度）
04-02
vue面试题及答案
vue初次实践两周总结
sinat_36227086的博客
09-11 741
1.vue中的computed （1）computed中的函数不能直接传参，即不能写成： computed: { showArowValue(index) { return this.showArowArray[index]; }, }, 如果需要传参，则需要使用闭包，即 computed: { showArowValue() { return function (index) { return this.s
vue mianjs 引用css_vue实战-换皮肤
weixin_39602615的博客
11-22 283
现在的app和pc网站做的越来越花哨，但是有时候用户并不喜欢你给他挑选好的主题颜色，这个时候就需要一个换皮肤的功能了。那么我们怎么在vue中实现这个换皮肤的功能呢？项目结构实现思路我们用vue一般都是写单页面程序，因此在实际发布的时候只有一个html以及一堆静态文件(js、css、img之类)。而在html中引用了这些js和css。我们要换皮肤的话其实就是动态的去切换css，所以在这里实现换皮肤其...
Vue必问面试题之Vue路由
是阿瑶的博客呀~
10-31 2858
1. 路由之间是怎么跳转的？有哪些方式 1、<router-link to="需要跳转到页面的路径"> 2、this.$router.push()跳转到指定的url，并在history中添加记录，点击回退返回到上一个页面 3、this.$router.replace()跳转到指定的url，但是history中不会添加记录，点击回退到上上个页面 4、this.$touter.go(n)向前或者后跳转n个页面，n可以是正数也可以是负数 2. vue-router怎么配置路由 在vue中配
2020届秋招/WEB前端工程师/面经/内附面试问题心得体会/vue框架面试题
DTY666的博客
10-23 7460
以BAT大厂为目标的带佬们可以绕路了，不是不想，实在是实力有限，大概BAT是每个程序员的梦吧，希望以后可以有机会。先说一下背景，博主坐标厦门某双非，学校整体求职氛围比较慢热，暑假的时候学院甚至还在实训。我自己真正开始求职已经是在十月份了。是的你没看错，就是十月，金九银十的十。想告诉大家找工作什么时候都不要怕晚，只要你肯就有机会。短暂的迷惘之后，博主迅速调整状态，开始每天牛客网刷题，复...
关于vue的常见面试题
热门推荐
keep789的博客
09-22 1万+
1.谈谈你对vue的认识 vue概念：是一个构建用户界面的渐进式框架，典型的MVVM框架。 注：模型（Model）只是普通的JavaScript对象，修改它则视图（View）会自动更新。这种设计让状态管理变得非常简单而直观。 vue作用：响应式的数据绑定和组合的视图组件 vue原理：数据双向绑定     模板编译和虚拟dom Vue实现数据双向绑定的效果，需要三大模块： Observe...
vue 面试问题总结
小羽向前跑
02-14 6793
vue-cli 工程常用的 npm 命令有哪些？ 全局安装 vue-cli npm install --global vue-cli创建一个基于 webpack 模板的新项目 vue init webpack my-project 进入项目目录，运行 cd my-project npm install npm run dev vue-cli 生成 生产环境部署资源 的 npm命令： npm...
vue千途面经完整版
最新发布
06-09
Vue千途面经（也称为Vue全栈开发实战或Vue全栈教程）是一系列全面学习Vue.js框架及其前后端技术集成的实践课程，通常涵盖了从基础入门到高级应用的全过程。它通常包括以下几个部分： 1. Vue基础知识：介绍Vue的核心概念，如组件、指令、模板、状态管理等。 2. Vuex：Vue的状态管理库，讲解如何组织和管理应用的数据。 3. Vue Router：用于导航的解决方案，如何创建路由、处理路由守卫和嵌套路由。 4. Vue CLI（命令行界面）：Vue的构建工具，如何创建和配置项目，使用脚手架生成代码。 5. API接口：学习如何与后端服务器进行数据交互，可能涉及JSON Web Tokens（JWT）、axios等库。 6. Vue Server-Side Rendering (SSR)：服务端渲染，如何提高SEO和性能。 7. Vuex ORM（如Vuex-ORM或TypeORM）：结合状态管理和数据库操作的解决方案。 8. Vue CLI 3及更高版本的特性：新版本的更新和优化。 9. 高级主题：例如响应式编程、Vuex最佳实践、Vue的生命周期钩子、测试和调试等。 10. 实战项目：通过完成一个完整的项目，应用所学知识，如电商网站、博客系统等。 如果你对某个部分特别感兴趣，可以告诉我，我可以深入解释相关知识点，或者提供一些资源链接以供学习。另外，你可能想了解的具体问题是？

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值