Vue选择题刷题记录(持续更新)

483 阅读3分钟

image.png

解析:v-for 可以遍历对象,拿到 value、key、index 值

image.png

解析:

image.png

image.png

解析:

vue中可以使用ref绑定相应的元素  ref=“name”
然后使用 this.$refs.name  获取到该元素,并且可以直接调用子组件中定义的方法;

image.png

image.png

解析:

使用  nextTick和异步任务函数能够确保视图更新完之后再获取到h1的 offsetWidth,nextTick大家基本都懂,js是单线程语言,异步任务在任务队列中等待同步任务执行结束后再执行,B和C选项同样保证了在视图更新完之后再获取。

image.png

image.png

image.png

image.png

解析:

image.png

image.png

image.png

image.png

image.png

解析: 虚拟 DOM 最大的优势在于抽象了原本的渲染过程,实现了跨平台的能力,而不仅仅局限于浏览器的 DOM,可以是安卓和 IOS 的原生组件,可以是近期很火热的小程序,也可以是各种 GUI。

image.png

image.png

解析:

image.png

参考:www.jianshu.com/p/4595d2311…

image.png

image.png

image.png

解析: mounted后一直到beforedestory都可以操作dom

image.png

image.png

解析:

全局:beforeEach(前置守卫),beforeResolve(解析守卫),afterEach(后置守卫)

单个路由守卫:beforeEnter

局部路由守卫:beforeRouteEnter(前置守卫),beforeRouteLeave(后置守卫),beforeRouteUpdate(路由改变守卫)

image.png

解析:

v-show和v-if都是在true的时候才会展示。因此A对。

v-show是无论结果为false还是true都会进行渲染,而v-if只有结果为true的时候才会进行渲染。因此v-show相对于v-if来说有更高的初次渲染成本,而v-if相对于v-show而言有更高的切换成本。所以B对。

v-show的本质就是通过设置display属性去控制展示,而v-if则会涉及对应模版/事件的挂载和卸载。因此C对,D错。

image.png

image.png

解析:

前端路由有两种模式:mode:hash/histroyhash:1.hash的优点是兼容性比较高,可以直接在项目布署上线时使用。2.hash的缺点是#不美观影响url的美感,并且如果移动端分享严格限制,可能会报错history:1.history的优点是不会影响到url的美感,提高了可观赏性2.history的缺点是需要与后端搭配,配合项目的部署上线!

- Hash模式基于锚点,以及onhashchange事件 —— 通过锚点的值作为路由地址

  • History 模式基于HTML5中的History API,即history.pushState()(IE10以后才支持)和 history.replaceState()两种方法

题目C的方法名写错了

image.png

image.png

image.png

image.png

image.png

image.png

image.png

解析:

SPA的优点:

  • 无刷新切换内容,提高用户体验。

  • 符合前后端分离的开发思想,通过ajax异步请求数据接口获取数据,后台只需要负责数据,不用考虑渲染。前端使用vue等MVVM框架渲染数据非常合适。

  • 减轻服务器压力,展示逻辑和数据渲染在前端完成,服务器任务更明确,压力减轻。

  • 后端数据接口可复用,设计JSON格式数据可以在PC、移动端通用。

缺点:

  • 不利于SEO(搜索引擎优化),应用数据是通过请求接口动态渲染,不利于SEO。
  • 首页加载慢,SPA下大部分的资源需要在首页加载,造成首页白屏等问题。

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png