Vue
文章平均质量分 55
Vue,js
zhangwenok
这个作者很懒,什么都没留下…
展开
-
面试官:为什么Vue中的v-if和v-for不建议一起用?
指令用于条件性地渲染一块内容。这块内容只会在指令的表达式返回 值的时候被渲染 指令基于一个数组来渲染一个列表。 指令需要使用 形式的特殊语法,其中 是源数据数组或者对象,而 则是被迭代的数组元素的别名在 的时候,建议设置值,并且保证每个值是独一无二的,这便于算法进行优化两者在用法上二、优先级与都是模板系统中的指令在模板编译的时候,会将指令系统转化成可执行的函数编写一个标签,同时使用与 创建实例,存放与数据模板指令的代码都会生成在函数中,通过就能得到渲染函数是的列表渲染函数转载 2022-06-12 20:07:44 · 185 阅读 · 0 评论 -
前端面试宝典(Vue)
Vue 数据双向绑定是通过数据劫持结合发布者-订阅者模式的方式来实现的。利用了 Object.defineProperty() 这个方法重新定义了对象获取属性值(get)和设置属性值(set)。一则语法糖,相当于 v-bind:value="xxx" 和 @input,意思是绑定了一个 value 属性的值, 子组件可对 value 属性监听,通过$emit('input', xxx)的方式给父组件通讯。自己实现 v-model 方式的组件也是这样的思路。看实际情况,一般在 created(或 befor原创 2022-06-02 13:19:57 · 177 阅读 · 0 评论 -
Vue3.0 里为什么要用 Proxy API 替代 defineProperty API?
Vue2.x 中的响应式实现正是基于 defineProperty 中的 descriptor,对 data 中的属性做了遍历 + 递归,为每个属性设置了 getter、setter。原创 2022-06-02 11:27:08 · 622 阅读 · 0 评论 -
Vue 中如何实现监测数组变化
vue中响应式数据的原理是通过Object.defineProperty控制getter和setter,并利用观察者模式完成的响应式设计。数组考虑性能原因没有用defineProperty对数组的每一项进行拦截,而是选择重写数组api方法。通过以上 Vue 源码部分查看,我们就能知道 Vue 框架是通过遍历数组 和递归遍历对象,从而达到利用Object.defineProperty() 也能对对象和数组(部分方法的操作)进行监听。Vue 将被侦听的数组的变更方法进行了包裹,所以它们也将会触发视图更新。原创 2022-06-02 11:15:02 · 5723 阅读 · 0 评论 -
vue中mixins和extends有什么区别?
mixinsmixins 选项接收一个混入对象的数组。这些混入对象可以像正常的实例对象一样包含实例选项,这些选项将会被合并到最终的选项中,使用的是和 Vue.extend() 一样的选项合并逻辑。var mixin = { created: function () { console.log(1) }}var vm = new Vue({ created: function () { console.log(2) }, mixins: [mixin]})// => 1/...原创 2022-05-31 15:49:47 · 2733 阅读 · 0 评论 -
vue 面试题汇总
vue 面试题汇总1、说说你对vue的理解?2、vue 的双向绑定的原理是什么3、说说你对SPA(单页应用)的理解?4、说说你对Vue生命周期的理解?5、为什么data属性是一个函数而不是一个对象?6、Vue中给对象添加新属性界面不刷新?7、说说你对nexttick的理解?8、Vue3有哪些新特性?9、vue-router 有哪几种导航钩子?10、mvvm 框架是什么?它和其他框架(jquery) 的区别是什么?11、什么是 vue 生命周期?有什么作用?12、active-cla原创 2022-05-30 16:32:37 · 152 阅读 · 0 评论 -
面试官:为什么data属性是一个函数而不是一个对象?
一、实例和组件定义data的区别vue实例的时候定义data属性既可以是一个对象,也可以是一个函数constapp=newVue({el:"#app",//对象格式data:{foo:"foo"},//函数格式data(){return{foo:"foo"}}})组件中定义data属性,只能是一个函数如果为组件data...转载 2022-05-30 10:28:03 · 434 阅读 · 0 评论 -
Vue中 watch 和 computed 区别和使用场景
对于Computed:它支持缓存,只有依赖的数据发生了变化,才会重新计算 不支持异步,当 Computed 中有异步操作时,无法监听数据的变化 如果一个属性是由其他属性计算而来的,这个属性依赖其他的属性,一般会使用 computed 如果 computed 属性的属性值是函数,那么默认使用 get 方法,函数的返回值就是属性的属性值;在 computed 中,属性有一个 get 方法和一个 set 方法,当数据发生变化时,会调用 set 方法。对于Watch:它不支持缓存,当一个属性发生变化原创 2022-05-20 17:44:34 · 2330 阅读 · 0 评论 -
前端练手项目集合
整理一些热门的前端开源项目,包括vue2.X、vue3.X、react等原创 2022-05-07 16:03:26 · 1532 阅读 · 0 评论 -
面试官:在vue中v-if和v-show的区别?
v-if 是“真正”的条件渲染,因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。v-if 也是惰性的:如果在初始渲染时条件为假,则什么也不做——直到条件第一次变为真时,才会开始渲染条件块。相比之下,v-show 就简单得多——不管初始条件是什么,元素总是会被渲染,并且只是简单地基于 CSS 进行切换。注意,v-show 不支持<template>元素,也不支持 v-else。 一般来说,v-if 有更高的切换开销,而 v-show 有更高的初始渲染开..原创 2022-05-06 13:07:52 · 1322 阅读 · 0 评论 -
面试官:vue中watch的属性用箭头函数定义结果会怎么样
答:this是undefined,要更改的属性会报TypeError错误, Cannot read property 'xxx' of undefined。因为箭头函数默绑定父级作用域的上下文,所以不会绑定vue实例,所以 this 是undefind。不应该使用箭头函数来定义 watcher 函数 (例如 searchQuery: newValue => this.updateAutocomplete(newValue))。理由是箭头函数绑定了父级作用域的上下文,所以 this 将不会按照.转载 2022-05-01 06:00:00 · 959 阅读 · 0 评论 -
面试官:在vue中watch和created哪个先执行?为什么?
面试官:看到你简历上写着精通Vue? --- 在vue中watch和created哪个先执行?为什么?原创 2022-04-19 13:10:32 · 9220 阅读 · 2 评论