•  💂 个人主页: 陶然同学
• 🤟 版权: 本文由【陶然同学】原创、在CSDN首发、需要转载请联系博主
• 💬 如果文章对你有帮助、欢迎关注、点赞、收藏(一键三连)和订阅专栏哦
• 💅 想寻找共同成长的小伙伴，请点击【Java全栈开发社区】
• 💬推荐一款模拟面试、刷题神器👉点击跳转此网站

一、computed 和 watch 的区别

computed： 是计算属性，依赖其它属性值，并且 computed 的值有缓存，只有它依赖的属性值发生改变，下一次获取 computed 的值时才会重新计算 computed 的值；

watch： 更多的是“观察”的作用，类似于某些数据的监听回调，每当监听的数据变化时都会执行回调进行后续操作；

二、vue-router 路由模式有几种？

vue-router 有 3 种路由模式：hash、history、abstract

各模式的说明如下：

hash: 使用 URL hash 值来作路由。支持所有浏览器，包括不支持 HTML5 History Api 的浏览器；

history : 依赖 HTML5 History API 和服务器配置。具体可以查看 HTML5 History 模式；

abstract : 支持所有 JavaScript 运行环境，如 Node.js 服务器端。如果发现没有浏览器的 API，路由会自动强制进入这个模式.

三、vue中为什么data是一个函数

组件的data写成一个函数，数据以函数返回值形式定义，这样每复用一次组件，就会返回一份新的data，类似于给每个组件实例创建一个私有的数据空间，让各个组件实例维护各自的数据。如果单纯的写成对象形式，就使得所有组件实例共用了一份data，这样一个实例中更新数据会导致其他实例数据改变。

四、v-if 和 v-show 的区别

v-if 在编译过程中会被转化成三元表达式，条件不满足时不渲染此节点。

v-show 会被编译成指令，条件不满足时控制样式将此节点隐藏

五、请列举几个vue内部指令，并说明其作用(至少五个)

1. v-bind：绑定属性，动态更新HTML元素上的属性。例如 v-bind:class；

2. v-on：用于监听DOM事件。例如 v-on:click v-on:keyup；

3. v-text：更新元素的textContent；

4. v-model：用来在 input、select、textarea、checkbox、radio 等表单控件元素上创建双向数据绑定，根据表单上的值，自动更新绑定的元素的值；

5. v-for：循环指令编译出来的结果是 -L 代表渲染列表。优先级比v-if高最好不要一起使用，尽量使用计算属性去解决；

6. v-show：使用指令来实现 -- 最终会通过display来进行显示隐藏；

六、你建不建议v-if和v-for一起使用？为什么？

v-for和v-if不要在同一标签中使用，因为解析时先解析v-for在解析v-if。如果遇到需要同时使用时可以考虑写成计算属性的方式。

七、v-for为什么要加key

v-for遍历时，key是Vue中vnode的唯一标记，通过这个 key，我们的 diff 操作可以更准确、更快速。

更准确是因为带 key时，在sameNode函数进行key值对比中可以避免就地复用的情况。所以会更加准确。

更快速是利用 key 的唯一性生成 map 对象来获取对应节点，比遍历方式更快

八、填空题

1. MVVM中的的Model表示页面中的数据和视图中间的调度者；
2. MVVM中的的View表示页面中的视图
3. VUE中可以使用DOM操作了;
4. 在HTML中被Vue实例控制的代码区域我们称之为View
5. 在Vue实例中的Data对象就是MVVM中的Model
6. new出来的Vue实例就是MVVM中的ViewModel
7. v-text指令是用来渲染文本的;
8. v-html指令是用来渲染HTML标签;
9. v-bind指令是用来给HTML属性绑定数据的;
10. v-bind的简写是:
11. v-on指令是给元素绑定事件的;
12. 给一个div添加一个点击事件可以使用指令@;
13. 在methods里的方法中想访问data里的数据可以使用this关键字;
14. v-html指令相当于js中的innserHTML属性;
15. VUE中v-for指令可以用来做循环;
16. 当我们频繁的操作显示和隐藏元素的时v-show更好;
17. v-else一般配个下面v-if指令使用;
18. Vue的$mount()方法可以动态指定要控制的区域;
19. 使用axios发起get请求的时候，第一个参数是请求地址；
20. 每当vue实例对象监控到data中的数据发生了变化，会立即重新解析执行el区域内所有的代码;
21. 当点击img图片使页面有一个弹框时，可以使用指令v-on
22. vue实例的method对象里的方法可以使用ES6简写;
23. @DateTimeFormat注解用于将指定格式的字符串转换为Date类型;
24. vue中通常把v-model通常使用在表单标签中;
25. vue中input元素可以使用v-model指令;

 结束语🏆🏆🏆

🔥推荐一款模拟面试、刷题神器网站

点击链接注册即可

1、算法篇（398题）：面试必刷100题、算法入门、面试高频榜单
2、SQL篇（82题）：快速入门、SQL必知必会、SQL进阶挑战、面试真题
3、大厂笔试真题：字节跳动、美团、百度、腾讯…

​​​​​​​

文章来源: blog.csdn.net，作者：陶然同学，版权归原作者所有，如需转载，请联系作者。

原文链接：blog.csdn.net/weixin_45481821/article/details/123535053