2020前端技术面试必备Vue:(一)基础快速学习篇
因为疫情的影响,相信很多小伙伴都宅在家里。中小企业会因为经营困难而裁员,我们也面临“失业”。你感到焦虑吗?我最近做了一个调查:‘你现在找到工作了吗?1、大部分回复:求职平台都是‘已回复’,然后就没有后续了,你遇到过吗?2、各种公司对技术的要求更高3、有人说开始搞副业了。在我看来,今年已经过去四分之一了,按照往年的说法,最晚的是2月,大家都应该开始工作了。现在是三月中旬,大概五月份就可以出去工作了。这段时间其实还是蛮宝贵的,我有很多空闲时间来提高自己的技能,迎接下一次面试。本章我将带领大家刷刷Vue技术点,以应对接下来的面试。这次更新Vue全家桶:VueVueXVue-Router;如果后面时间充裕,我会实现一个Vue项目。vue样式绑定类使用1.通过数组添加样式通过数组添加样式['样式名']-->这里的样式名是预先在CSS中定义的,使用:class绑定使用添加样式2._通过添加对象判断_{'样式名称',布尔值变量}添加样式3.使用计算属性控制样式的显示
data:{isActive:true,error:null},computed:{classObject:function(){return{active:this.isActive&&!this.error,'text-danger':this.error&&this.error.type==='fatal'}}}style内联样式使用CSS属性名命名可以用驼峰式或破折号分隔(kebab-case,记得用引号括起来)1._通过转到中的传入对象style改变style_缺点:不能通过多个对象
Test通过给样式传入一个数组,可以在数组中放置多个对象Test条件渲染v-if和v-show//两条指令都可以用来控制元素渲染//不同的是:1.v-if用来控制元素的创建和销毁2.v-show用来控制元素的显示变化//选择使用:如果你非常频繁地需要条件在运行时很少发生变化,那么最好使用v-show;如果条件在运行时很少改变,最好使用v-if。列表呈现v-forv-for指令基于数组呈现列表。格式:1.遍历数组(item,index)initemsitem为每一项,index为索引,遍历object(value,name,index)inobjectvalue为valuename为keyindex为索引注1根据JavaScript机制,in可以改为of,更接近于JavaScript遍历项必须绑定一个key来确定每个节点的身份变异方法//官方含义:调用的原数组这些方法将被更改。简单的说:就是改变原数组,对原数组做一些操作,比如:add,delete..//变异方法包括:push()pop()shift()unshift()splice()sort()reverse()非变异方法//所谓非变异方法:不改变原数组,生成新数组//非变异方法包括:filter()concat()slice()....注意//vm是一个Vue实例varvm=newVue({data:{items:['a','b','c']}})[//当你使用索引直接设置数组项时vm.items[indexOfItem]=newValue?错误操作//官方提供了两种解决方案1.Vue.setVue.set(vm.items,indexOfItem,newValue)2.Array.prototype.splicevm.items.splice(indexOfItem,1,newValue)//当你修改数组的长度时当vm.items.length=newLength?错误操作//官方提供了解决方案1.vm.items.splice(newLength)objectchange注意有时候这种需求可能是遇到,在原始数据对象属性中,想实现Dynamallically添加属性,直接添加yes,没有responsive,官方提供了解决方案。varvm=newVue({data:{userProfile:{name:'Anika'}}})//添加一个属性可以使用Vue.set(vm.userProfile,'age',27)//赋值给一个现有对象多个新属性,可以使用Object.assign()vm.userProfile=Object.assign({},vm.userProfile,{age:27,favoriteColor:'VueGreen'})来显示过滤/排序的结果有时,我们希望在不实际更改或重置原始数据的情况下显示数组的过滤或排序版本。在这种情况下,创建一个返回过滤或排序数组的计算属性。 事件处理事件修饰符vue.js提供了V-O的事件修饰符,对于事件的一些操作限制,修饰符表示为命令后缀以点开头。.stop.prevent.capture.self.once.passive.once