写给我自己看得。答案是我自己谷歌的。
基础类问题
1.v-if 和v-show 区别:
v-if 是动态添加,当值为false 时,是完全移除该元素,即dom 树中不存在该元素。 v-show 仅是隐藏/ 显示,值为false 时,该元素依旧存在于dom 树中。 若其原有样式设置了display: none 则会导致其无法正常显示。
2.router的区别是什么?
router是“路由实例”对象包括了路由的跳转方法,钩子函数等。
3.请举例Vue几种常用的指令?
v-for v-if v-show v-html
4.Vue常用的修饰符有哪些?
.stop .prevent .enter .trim
5.v-on可以绑定多个方法吗?
可以(例如 <input @input="onInput" @focus="onFocus" @blur="onBlur" />
6.VUE中key值得作用?
1.key的作用主要是为了高效的更新虚拟DOM,其原理是vue在patch过程中通过key可以精准判断两个节点是否是同一个,从而避免频繁更新不同元素,减少DOM操作量,提高性能。 2.另外,若不设置key,还可以在列表更新时引发一些隐蔽的bug。
7.什么是Vue的计算属性
computed计算属性是用来声明式的描述一个值依赖了其它的值。 当你在模板里把数据绑定到一个计算属性上时,Vue 会在其依赖的任何值导致该计算属性改变时更新DOM。 这个功能非常强大,它可以让你的代码更加声明式、数据驱动并且易于维护。
8.如何定义vue-router 的动态路由,获取传过来的值?
query和param两种方式
$route对象中可以取到值
9.watch和computed的差异是什么?
计算属性computed :
1、支持缓存,只有依赖数据发生改变,才会重新进行计算
2、不支持异步,当computed内有异步操作时无效,无法监听数据的变化
3、computed 属性值会默认走缓存,计算属性是基于它们的响应式依赖进行缓存的,也就是基于data中声明过或者父组件传递的props中的数据通过计算得到的值
4、如果一个属性是由其他属性计算而来的,这个属性依赖其他属性,是一个多对一或者一对一,一般用computed
5、如果computed属性属性值是函数,那么默认会走get方法;函数的返回值就是属性的属性值;在computed中的,属性都有一个get和一个set方法,当数据变化时,调用set方法。
侦听属性watch:
1、不支持缓存,数据变,直接会触发相应的操作;
2、watch支持异步;
3、监听的函数接收两个参数,第一个参数是最新的值;第二个参数是输入之前的值;
4、当一个属性发生变化时,需要执行对应的操作;一对多;
5、监听数据必须是data中声明过或者父组件传递过来的props中的数据,当数据变化时,触发其他操作,函数有两个参数,
immediate:组件加载立即触发回调函数执行,
deep: 深度监听,为了发现对象内部值的变化,复杂类型的数据时使用,例如数组中的对象内容的改变,注意监听数组的变动不需要这么做。注意:deep无法监听到数组的变动和对象的新增,参考vue数组变异,只有以响应式的方式触发才会被监听到。
10.组件中data为什么是函数?
对于这个问题很多小伙伴都问过。其实官方也有自己的说法,下面这个是官方的解答:
当一个组件被定义, data 必须声明为返回一个初始数据对象的函数,因为组件可能被用来创建多个实例。如果 data 仍然是一个纯粹的对象,则所有的实例将共享引用同一个数据对象!通过提供 data 函数,每次创建一个新实例后,我们能够调用 data 函数,从而返回初始数据的一个全新副本数据对象。
其实也很好理解,大概意思就是:
类比与引用数据类型。如果不用function return 每个组件的data都是内存的同一个地址,那一个数据改变其他也改变了,这当然就不是我们想要的。用function return 其实就相当于申明了新的变量,相互独立,自然就不会有这样的问题;js在赋值object对象时,是直接一个相同的内存地址。所以为了每个组件的data独立,采用了这种方式。
如果不是组件的话,正常data的写法可以直接写一个对象,比如data:{ msg : ' 下载 ' },但由于组件是会在多个地方引用
的,JS中直接共享对象会造成引用传递,也就是说修改了msg后所有按钮的msg都会跟着修 改,所以这里用function来每次返回一个
对象实例。
from blog.csdn.net/shaleilei/a…
扩展类问题
1.请谈谈对MVVM的理解?
MVVM是Model-View-ViewModel的简写。它本质上就是MVC 的改进版。MVVM 就是将其中的View 的状态和行为抽象化,让我们将视图 UI 和业务逻辑分开。当然这些事 ViewModel 已经帮我们做了,它可以取出 Model 的数据同时帮忙处理 View 中由于需要展示内容而涉及的业务逻辑。微软的WPF带来了新的技术体验,如Silverlight、音频、视频、3D、动画……,这导致了软件UI层更加细节化、可定制化。同时,在技术层面,WPF也带来了 诸如Binding、Dependency Property、Routed Events、Command、DataTemplate、ControlTemplate等新特性。MVVM(Model-View-ViewModel)框架的由来便是MVP(Model-View-Presenter)模式与WPF结合的应用方式时发展演变过来的一种新型架构框架。它立足于原有MVP框架并且把WPF的新特性糅合进去,以应对客户日益复杂的需求变化。
2.第一次页面加载会触发哪几个钩子?
第一次页面加载时会触发 beforeCreate, created, beforeMount, mounted 这几个钩子
3.DOM渲染在哪个生命周期中完成?
DOM 渲染在 mounted 中就已经完成了
4.Vue实现数据双向绑定的原理
在创建Vue实例的时候给传入的data进行数据劫持,同时视图编译的时候,对于使用到data中数据的地方进行创建Watcher对象,然后在数据劫持的getter中添加到发布者对象中,当劫持到数据发生变化的时候,就通过发布订阅模式以回调函数的方式通知所有观察者操作DOM进行更新,从而实现数据的双向绑定。
复制于 :segmentfault.com/a/119000002…
5.VUE组件中的参数传递
1).父组件--->子组件:父组件传值给子组件使用Props属性
2).子组件--->父组件:子组件传值给父组件使用Emit事件。
还可以用路由地址。vuex