vue面试题(三)

109 阅读2分钟

持续创作,加速成长!这是我参与「掘金日新计划 · 10 月更文挑战」的第16天,点击查看活动详情

42.页面第一次加载触发哪几个钩子?

beforeCreate,created,beforeMount,mounted。

43.vue常用的修饰符

  • .prevent阻止默认事件,比如a标签的跳转。
  • .stop阻止单击事件冒泡。
  • .self当event target是元素本身才可以触发。
  • .capture事件侦听,事件发生时会调用。

44.常用指令

image.png

45.vue如何定义一个过滤器

可以全局注册,Vue.filter('过滤器名称',回调函数)

46.如何理解Vuex

vuex是一个专门为vue.js应用开发的状态管理库。能够集中存储所有组件的状态(数据)。并且可以通过状态来驱动组件的变化。

  • state:状态,也就是数据存放在这里。
  • mutations:在这里改变state里的数据,也只有这里能修改state里的数据。注意,mutations里面只能放同步逻辑。
  • actions:存放异步逻辑代码,操作mutations改变state里的状态。
  • getters:相当于计算属性,一般用来对state里的数据进行一次简单的封装,方便在组件中调用。
  • modules:为了更加直观的查看状态,可以多建几个小型的vuex模块,最后在主vuex模块里面通过modules导出。

47.vuex的工作流程

  1. 在组件中使用dispatch触发vuex里面的actions里面的异步函数
  2. 在actions里使用commit触发mutations里的同步函数
  3. 在mutations的同步函数里面直接修改state里的数据
  4. 数据修改完毕后,传导给页面,页面的数据也会发生变化

48.说一下你在学vue时踩过的坑

  1. 使用数组方法修改数组,无法驱动视图层发生变化。因为只有那七个方法vue底层进行了重写,其他的方法需要使用Vue.set()。究其根本,是因为vue2的响应式系统使用的是Object.defineProperty无法检测到数组里面的变化。v3使用了proxy对响应式系统进行了重写,可以对整个数组数据进行深度监视。

  2. 对于this.$nextTick()的使用。