2021-05-14 vue常用指令用法及其面试题

                                                              vue常用指令用法及其面试题

1.v-on:

事件监听器(如：v-on:click点击事件)

2.v-if和v-show

1.v-show跟v-if都是做条件隐藏跟显示用的,

2.v-show是针对display的css属性进行操作，v-if是操作dom元素节点

建议高频情况下使用v-show，其他用v-if

3.v-bind：

用于绑定标签里面的属性值

4.v-model：

实现表单输入和应用状态之间的双向绑定

5.v-for：

循环指令

6.v-text和v-html

1.v-text v-text是用于操作纯文本

2.v-html 用于输出html

v-text仅渲染标签，不能解析 HTML 代码

axios可用于发送请求

 

 

                                                                            有关vue的面试题：

1.vue优点？

轻量级框架
简单易学
双向数据绑定
组件化
视图，数据，结构分离
虚拟DOM
运行速度更快

2.v-show和v-if指令的共同点和不同点

共同点：都能控制元素的显示和隐藏；

不同点：v-show本质就是通过控制css中的display设置为none，v-if是动态的向DOM树内添加或者删除DOM元素

3.Vue中双向数据绑定是如何实现的？

vue是通过数据劫持的方式来做数据绑定的，其中最核心的方法便是通过Object.defineProperty()来实现对属性的劫持，那么在设置或者获取的时候我们就可以在get或者set方法里假如其他的触发函数，达到监听数据变动的目的

4.vue和jQuery的区别

jQuery是使用选择器（$）选取DOM对象，对其进行赋值、取值、事件绑定等操作，其实和原生的HTML的区别只在于可以更方便的选取和操作DOM对象，而数据和界面是在一起的。比如需要获取label标签的内容：$("lable").val();,它还是依赖DOM元素的值。
Vue则是通过Vue对象将数据和View完全分离开来了。对数据进行操作不再需要引用相应的DOM对象，可以说数据和View是分离的，他们通过Vue对象这个vm实现相互的绑定。

5.谈谈你对MVVM开发模式的理解

  MVVM分为Model、View、ViewModel三者。

• Model：代表数据模型，数据和业务逻辑都在Model层中定义；

• View：代表UI视图，负责数据的展示；

• ViewModel：负责监听Model中数据的改变并且控制视图的更新，处理用户交互操作；

       Model和View并无直接关联，而是通过ViewModel来进行联系的，Model和ViewModel之间有着双向数据绑定的联系。因此当Model中的数据改变时会触发View层的刷新，View中由于用户交互操作而改变的数据也会在Model中同步。

这种模式实现了Model和View的数据自动同步，因此开发者只需要专注对数据的维护操作即可，而不需要自己操作dom。

5.vue 中怎么重置 data?

Object.assign(this.$data, this.$options.data(this))