1、Vue2和Vue3的数据劫持的区别:
1:兼容区别
稳定版v2兼容IE9+,9一下不兼容,v3兼容IE11+,11以下不兼容
2:数据双向绑定
vue2一次就只能劫持一个属性,也可以劫持多个属性,但需要for循环
vue2如果在劫持字后在增加一个新的属性,这个属性是没有被劫持的,需要额外的进行操作
vue3可以劫持多个属性,因为vue3通过proxy(代理)进行代理,返回的是一个新对象
3:vue3数据劫持通过proxy代理
通过proxy进行代理之候无论是设置还是获取都找这个代理对象,他有三个参数:
target:代理的目标对象 key:属性名 vulue
4:vue2数据劫持通过ES5语法object.defineProperty
Object.defineProperty用于监听对象的数据变化,无法监听数组变化(下标,长度),只能劫持对象的自身属性,动态添加的劫持不到
proxy返回的是一个新对象,可以通过操作返回的新的对象达到目的,可以监听数组变化,也可以监听到动态添加的数据
2、v-if和v-for的优先级 ---v-for比v-if 的优先级高
1:永远不要把v-if与v-for写在一个元素上,会带来性能方面的浪费(每次渲染都会先循环在进行条件判断)
2:避免发生这样的情况,则在外层嵌套template(页面渲染不生成dom节点),在这一层进行v-if判断后在内部进行v-for循环
<template v-if="isShow"> <p v-for="item in items"> </template>
3、v-if和v-show的语法
1:共同点:都可以实现元素的显示隐藏
2:区别:
1、v-show只是简单地控制元素的display属性,而v-if才是条件渲染(条件为真,就会渲染,条件为假,元素会被销毁)
2:v-show有更高的首次渲染开销,而v-if的首次开销要小很多
3、v-if有跟高的切换开销
4、v-if有配套的v-else和v-else
5、v-if可以搭配template使用


浙公网安备 33010602011771号