【面试题-Vue】常见问题一、指令类
admin
2024-01-29 04:06:23
0

一、常用到的指令有哪些?

v-html、v-text、v-show、v-if、v-else、v-else-if、v-for、v-bind、v-on、v-model等等。

不常用的指令
v-pre 令vue语法失效
v-once 元素只渲染一次

二、v- show 与 v - if 有什么区别?

v - if:真正意义上的条件渲染,对dom树发生改变。为true是渲染(dom存在),为false时不存在(dom不存在)。
v-show:是通过控制display属性来进行dom的显示与隐藏

性能区别:
1、v-if有更高的切换开销,v-show有更高的初始渲染开销。
如果需要频繁的切换,使用v-show比较好,如果运行条件很少改变,使用v-if比较好。
2、v-show比v-if性能更高,因为v-show只能动态的改变样式,不需要增删DOM元素。所以当程序不是很大时候,v-if和v-show区别都不大,如果项目很大,推荐多用v-show,较少浏览器后期操作的性能。
3、需要多种条件场景,比如id=1,=2,=3…时候,因为只有v-if,可以和v-else等连用,这种比较适合用v-if。
4、v-show不支持语法。
5、v-if切换时候回实时的销毁和重建内部的事件、钩子函数等,v-show只会初始化渲染时候执行,再切换时候不会执行生命后期的过程

三、v- for 中 key 是否为必须?以及它的作用?

必须的。
使用v-for循环一个list,当list发生更新时,v-for默认使用 就地更新策略进行渲染,即根据 key 值去判断某个数据是否修改,如果修改了就重新渲染,不然就复用之前的元素。
方案一:使用index作为key,不推荐
1.在list最后添加一条数据,此时用 index 作为 key,没有任何问题,
2.在list中间插入一条数据,此时用 index 作为 key,很多条数据的index会发生改变,因此v-for会渲染多条数据,降低效率,因此不推荐的。
方案二:使用id(list数据中具有唯一性的值)作为key,推荐
多数情况只会渲染一条数据,相比之下效率更高一些。

四、谈一下v-for和v-if的优先级

在源码中,v-for优先与v-if被解析,也就是说v-for优先级更高

常遇到的问题:
同时使用两者是,每次v-for循环,都会执行一次v-if,假设有个容量为1000的数组,那么v-if会被执行1000次,会十分消耗性能,降低代码质量。

怎么处理这种问题?这要根据判断调试是否和循环的内容有关系,分为两种情况:
1.在v-if不依赖v-for中某个值的前提下:可以在循环的外层添加template标签,在template中做v-if判断,这样可以让v-if的判断优先。

   ...isShowList:true,list: [{ id: 0, name: '张三' },{ id: 1, name: '李四' },{ id: 2, name: '王五' }]...

2.当v-if的判断条件依赖于v-for的内容时:可以在computed计算属性里先做好判断,过滤出符合条件的元素重新组成新的数组,在dom中循环这个新的数组。这样就不需要加v-if判断了。要知道,在computed里过滤的成本远比v-if低的多。

    
{{item.name}}
...list: [{ id: 0, name: '张三', isShow: true },{ id: 1, name: '李四', isShow: false },{ id: 2, name: '王五', isShow: true }]...computed: {newlist() {return this.list.filter(v => v.isShow)}},...

相关内容

热门资讯

领克车机系统安卓,安卓智能驾驶... 你有没有发现,现在开车的时候,车机系统越来越智能了?尤其是领克的安卓车机系统,简直让人爱不释手。今天...
安卓原生系统通知声音,定制个性... 你知道吗?手机里那些时不时冒出来的通知,有时候就像小精灵在耳边悄悄说话,有时候又像是闹钟在催你起床。...
安卓系统电脑键盘功能 你有没有发现,用安卓系统电脑打字的时候,键盘功能可真是丰富得让人眼花缭乱呢?今天,就让我带你一起探索...
安卓修改文件系统后缀,解锁文件... 你有没有想过,你的安卓手机里的文件系统后缀可以随意修改?听起来是不是有点神奇?没错,今天就来带你一探...
安卓系统多任务流转 你有没有发现,在使用安卓手机的时候,有时候会突然冒出一个任务流转的功能,让你瞬间切换到另一个应用,是...
神姬红包版安卓系统,解锁全新游... 你知道吗?最近在手机圈里,有个神姬红包版安卓系统可是火得一塌糊涂呢!这不,我就迫不及待地来和你聊聊这...
为什么国内要用安卓系统,探索国... 你知道吗?在国内,安卓系统可是占据了半壁江山呢!为什么国内要用安卓系统呢?这背后可是有着不少有趣的故...
htc安卓系统怎么升级8.0,... 亲爱的手机控们,你是否也像我一样,对手机系统升级充满了期待和好奇呢?尤其是当HTC安卓系统升级到8....
安卓系统最好的应用助手,助你轻... 你有没有发现,手机里那些乱糟糟的图标和复杂的设置让你头疼不已?别担心,今天我要给你介绍一个安卓系统里...
安卓系统如何下载teamhub... 你有没有想过,在安卓系统上下载一个叫做Teamhub的应用程序呢?这可是个超级实用的工具,无论是工作...
安卓系统如何看无线密码,安卓系... 你有没有想过,你的安卓手机是怎么看懂无线密码的呢?是不是觉得这背后藏着什么神秘的黑科技?别急,今天就...
pd13安装安卓系统,PD13... 你有没有想过,给你的PD13平板电脑装个全新的安卓系统,让它焕发第二春呢?想象那流畅的操作体验,那丰...
苹果系统怎么比安卓好,五大优势... 你有没有想过,为什么苹果系统那么多人喜欢,而安卓系统虽然普及,但总感觉少了点啥?今天,就让我来给你细...
苏州攻略系统和安卓互通,安卓互... 你打算去苏州游玩一番,是不是已经迫不及待想要探索这座古城的韵味了呢?别急,别急,让我来给你支支招,让...
安卓变苹果系统教程荣耀,安卓变... 你是不是也和我一样,对手机系统转换充满了好奇?想要从安卓跳到苹果的阵营,却又觉得一头雾水?别担心,今...
安卓115系统编写 你有没有听说啊?安卓115系统最近可是火得一塌糊涂!作为一个紧跟科技潮流的数码达人,我怎么能不给你来...
安卓系统内录怎么搞,轻松实现屏... 你有没有想过,在安卓手机上录制屏幕,那可是一项超实用的技能呢!无论是想记录游戏操作,还是制作教程,或...
国服无法进入安卓系统,安卓系统... 最近有没有发现,你的安卓手机上那些心仪的国服游戏突然变得高不可攀了呢?别急,让我来给你揭秘这背后的故...
安卓系统破解wifi密码破解,... 你是不是也和我一样,对破解WiFi密码这个话题充满了好奇?想象当你身处一个陌生的环境,急需上网却苦于...
安卓系统项目发布平台 你知道吗?在科技飞速发展的今天,安卓系统项目发布平台可是个香饽饽呢!它就像一个巨大的舞台,让无数开发...