logo资料库

Vue.js面试题整理带答案 .pdf

发布时间：2022-05-29 发布人：admin 分类：说明书 资料大小：0.36M 资料格式：pdf 举报 版权申诉
第1页 / 共12页
第2页 / 共12页
第3页 / 共12页
第4页 / 共12页
第5页 / 共12页
第6页 / 共12页
第7页 / 共12页
第8页 / 共12页
资料共12页，剩余部分请下载后查看
    什么是MVVM？
    mvvm和mvc区别？它和其它框架（jquery）的区别是什么？哪些场景适合？
    vue的优点是什么？
    组件之间的传值？
    路由之间跳转
    vue.cli中怎样使用自定义的组件？有遇到过哪些问题吗？
    七、vue如何实现按需加载配合webpack设置
    vuex相关
    （1）vuex是什么？怎么使用？哪种功能场景使用它？
    （2）vuex有哪几种属性？
    （3）不用Vuex会带来什么问题？
    v-show和v-if指令的共同点和不同点
    如何让CSS只在当前组件中起作用
    的作用是什么?
    Vue中引入组件的步骤?
    指令v-el的作用是什么?
    在Vue中使用插件的步骤
    请列举出3个Vue中常用的生命周期钩子函数
    active-class是哪个组件的属性？
    怎么定义vue-router的动态路由以及如何获取传过来的动态参数？
    vue-router有哪几种导航钩子？
    生命周期相关面试题
    （1）、什么是vue生命周期
    （2）、vue生命周期的作用是什么
    （3）、vue生命周期总共有几个阶段
    （4）、第一次页面加载会触发哪几个钩子
    （5）、DOM 渲染在 哪个周期中就已经完成
    （6）、简单描述每个周期具体适合哪些场景
    说出至少4种vue当中的指令和它的用法？
    vue-loader是什么？使用它的用途有哪些？
    scss是什么？在vue.cli中的安装使用步骤是？有哪几大特性？
    为什么使用key？
    为什么避免 v-if 和 v-for 用在一起
    VNode是什么？虚拟 DOM是什么？
    Vue Slot是做什么的？
    什么是 MVVM？ MVVM 是 Model-View-ViewModel 的缩写。MVVM 是一种设计思想。Model 层代表数 据模型，也可以在 Model 中定义数据修改和操作的业务逻辑；View 代表 UI 组件，它负 责将数据模型转化成 UI 展现出来，ViewModel 是一个同步 View 和 Model 的对象。 在 MVVM 架构下，View 和 Model 之间并没有直接的联系，而是通过 ViewModel 进行 交互，Model 和 ViewModel 之间的交互是双向的， 因此 View 数据的变化会同步到 Model 中，而 Model 数据的变化也会立即反应到 View 上。 ViewModel 通过双向数据绑定把 View 层和 Model 层连接了起来，而 View 和 Model 之间的同步工作完全是自动的，无需人为干涉，因此开发者只需关注业务逻辑，不需要手动 操作 DOM, 不需要关注数据状态的同步问题，复杂的数据状态维护完全由 MVVM 来统一 管理。 mvvm 和 mvc 区别？它和其它框架（jquery）的区别是什么？哪些场景适合？ mvc 和 mvvm 其实区别并不大。都是一种设计思想。主要就是 mvc 中 Controller 演变成 mvvm 中的 viewModel。mvvm 主要解决了 mvc 中大量的 DOM 操作使页面渲染性能降 低，加载速度变慢，影响用户体验。 区别：vue 数据驱动，通过数据来显示视图层而不是节点操作。 场景：数据操作比较多的场景，更加便捷 vue 的优点是什么？
    低耦合。视图（View）可以独立于 Model 变化和修改，一个 ViewModel 可以绑定到不同的"View"上，当 View 变化的时候 Model 可以不变，当 Model 变化的时候 View 也可以不变。 可重用性。你可以把一些视图逻辑放在一个 ViewModel 里面，让很多 view 重用这段视图逻辑。 独立开发。开发人员可以专注于业务逻辑和数据的开发（ViewModel）， 设计人员可以专注于页面设计。 可测试。界面素来是比较难于测试的，而现在测试可以针对 ViewModel 来 写。 组件之间的传值？   父组件与子组件传值 父组件通过标签上面定义传值 子组件通过 props 方法接受数据 子组件向父组件传递数据 子组件通过$emit 方法传递参数 路由之间跳转 声明式（标签跳转） 编程式（ js 跳转） vue.cli 中怎样使用自定义的组件？有遇到过哪些问题吗？
        第一步：在 components 目录新建你的组件文件（indexPage.vue），script 一定要 export default {} 第 二步 ：在 需 要用 的页 面 （组 件） 中导 入 ：import indexPage from '@/components/indexPage.vue' 第 三 步 ： 注 入 到 vue 的 子 组 件 的 components 属 性 上 面,components:{indexPage} 第四步：在 template 视图 view 中使用， 例如有 indexPage 命名，使用的时候则 index-page 七、vue 如何实现按需加载配合 webpack 设置 webpack 中提供了 require.ensure()来实现按需加载。以前引入路由是通过 import 这样 的方式引入，改为 const 定义的方式进行引入。 不进行页面按需加载引入方式：import home from '../../common/home.vue' 进行页面按需加载的引入方式：const home = r => require.ensure( [], () => r (require('../../common/home.vue'))) vuex 相关 （1）vuex 是什么？怎么使用？哪种功能场景使用它？ vue 框架中状态管理。在 main.js 引入 store，注入。新建一个目录 store，….. export 。 场景有：单页应用中，组件之间的状态。音乐播放、登录状态、加入购物车 （2）vuex 有哪几种属性？
    有五种，分别是 State、 Getter、Mutation 、Action、 Module  vuex 的 State 特性 A、Vuex 就是一个仓库，仓库里面放了很多对象。其中 state 就是数据源存放地，对应 于一般 Vue 对象里面的 data B、state 里面存放的数据是响应式的，Vue 组件从 store 中读取数据，若是 store 中的 数据发生改变，依赖这个数据的组件也会发生更新 C、它通过 mapState 把全局的 state 和 getters 映射到当前组件的 computed 计算 属性中  vuex 的 Getter 特性 A、getters 可以对 State 进行计算操作，它就是 Store 的计算属性 B、 虽然在组件内也可以做计算属性，但是 getters 可以在多组件之间复用 C、 如果一个状态只在一个组件内使用，是可以不用 getters  vuex 的 Mutation 特性 Action 类似于 mutation，不同在于：Action 提交的是 mutation，而不是直接变更 状态；Action 可以包含任意异步操作。 （3）不用 Vuex 会带来什么问题？  可维护性会下降，想修改数据要维护三个地方；  可读性会下降，因为一个组件里的数据，根本就看不出来是从哪来的；  增加耦合，大量的上传派发，会让耦合性大大增加，本来 Vue 用 Component 就是 为了减少耦合，现在这么用，和组件化的初衷相背。
    v-show 和 v-if 指令的共同点和不同点   v-show 指令是通过修改元素的 display 的 CSS 属性让其显示或者隐藏 v-if 指令是直接销毁和重建 DOM 达到让元素显示和隐藏的效果 如何让 CSS 只在当前组件中起作用 将当前组件的