前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Vue前端面试2021-016

Vue前端面试2021-016

作者头像
大牧莫邪
发布2021-12-06 18:06:14
3220
发布2021-12-06 18:06:14
举报

1、简述用过Vue指令,并阐述这些指令的含义

v-text/v-html 用于渲染数据 v-once 用于一次性加载数据 v-show/v-if 用于条件判断渲染数据 v-if /v-for 用于程序流程控制 v-bind 动态操作属性 v-on 绑定操作事件 v-model 表单数据绑定

2、Vue实例中的data为什么是一个对象,组件中的data为什么是一个返回对象的函数?

Vue开发的应用一般都是单页面应用,通常情况下只有唯一一个Vue实例,所以实例中的数据可以在当前项目中共享,所以Vue实例中的data是一个对象 Vue组件的出现,是为了组件中的视图和数据可以复用,被复用的组件在不同的复用位置可能在操作不同的数据,所以每个组件的data数据必须互相独立,所以组件中的data是一个函数,函数内部返回一个只能让当前组件使用的对象数据

3、Vue实例中,数组通过push()/pop()函数的数据更新可以完成数据双向渲染,为什么通过[索引]的形式增加数据不会引起数据双向渲染?应该怎么解决?

Vue中的数据双向绑定底层是通过数据劫持实现的,数据劫持中如果对目标对象数据进行更新操作就会自动调用set()函数完成数据赋值和视图的更新;但是如果数据是查询操作的时候会自动调用get()函数完成数据获取; 数组通过push()/pop()函数是一种显式的数据更新操作,所以会自动完成数据同步渲染;通过[索引]的形式本质上获取数据的操作,所以不会调用set()函数完成数据同步渲染 如果必须通过索引的形式完成数据的更新并且要同步渲染,Vue2.x版本中可以通过Vue提供的vm.$set()或者Vue.set()函数完成数据双向同步

4、讲述Vue中都有哪些生命周期?

  • 创建阶段 beforeCreate: 实例创建前 created:实例创建后 beforeMount: 虚拟DOM渲染前 mounted: 虚拟DOM渲染之后
  • 运行阶段 beforeUpdate: 数据更新前 updated: 数据更新后
  • 销毁阶段 beforeDestory: 实例销毁前 destroyed: 实例销毁后
  • 缓存组件生命周期 activated:组件激活 deactivated:组件失活

5、v-for指令循环中为什么要使用key属性?

v-for指令主要用于循环展示户数,通过key属性可以将视图中的数据进行唯一性渲染,保障数据的正确渲染展示

6、简述组件的缓存如何实现?实现缓存的好处是什么?

组件的缓存通过<keep-alive>进行包含,组件在切换过程中就不会频繁的创建和销毁,在一定程度上节省了系统资源同时提高了运行效率; 被缓存的组件中如果要执行数据更新,可以通过缓存组件的activated和deactivated生命周期完成

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2021/11/12 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 1、简述用过Vue指令,并阐述这些指令的含义
  • 2、Vue实例中的data为什么是一个对象,组件中的data为什么是一个返回对象的函数?
  • 3、Vue实例中,数组通过push()/pop()函数的数据更新可以完成数据双向渲染,为什么通过[索引]的形式增加数据不会引起数据双向渲染?应该怎么解决?
  • 4、讲述Vue中都有哪些生命周期?
  • 5、v-for指令循环中为什么要使用key属性?
  • 6、简述组件的缓存如何实现?实现缓存的好处是什么?
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档