VUE面试题汇总（四）

最新推荐文章于 2024-10-28 15:18:39 发布

柠檬树上柠檬果柠檬树下你和我

最新推荐文章于 2024-10-28 15:18:39 发布

阅读量2.7k

点赞数 4

分类专栏： vue 面试题文章标签： vue.js vue javascript 面试前端

本文链接：https://blog.csdn.net/qq_39765048/article/details/121600157

版权

面试题同时被 2 个专栏收录

25 篇文章 4 订阅

订阅专栏

vue

22 篇文章 82 订阅

订阅专栏

往期点这里：↓
VUE面试题汇总（一）
VUE面试题汇总（二）
VUE面试题汇总（三）
31. v-model 语法糖的组件中的使用

参考答案：

<input type="text" v-model="mes">

此时mes值就与input的值进行双向绑定。

实际上上面的代码是下面代码的语法糖。

<input  v-bind:value="mes"  v-on:input="mes= $event.target.value"/>

要理解这行代码，首先你要知道 input 元素本身有个 oninput 事件，这是 HTML5 新增加的，类似 onchange ，每当输入框内容发生变化，就会触发 oninput ，把最新的value传递给 mes。从而实现了v-model。

32. 十个常用的自定义过滤器

参考答案：
参考

33. vue 等单页面应用及其优缺点

参考答案：

优点：
1、用户体验好、快，内容的改变不需要重新加载整个页面，避免了不必要的跳转和重复渲染。
2、前后端职责业分离（前端负责view，后端负责model），架构清晰
3、减轻服务器的压力

缺点：
1、SEO（搜索引擎优化）难度高
2、初次加载页面更耗时
3、前进、后退、地址栏等，需要程序进行管理，所以会大大提高页面的复杂性和逻辑的难度

34. 什么是 vue 的计算属性？

参考答案：
先来看一下计算属性的定义：

当其依赖的属性的值发生变化的时，计算属性会重新计算。反之则使用缓存中的属性值。

计算属性和vue中的其它数据一样，都是响应式的，只不过它必须依赖某一个数据实现，并且只有它依赖的数据的值改变了，它才会更新。

35. vue 父组件如何向子组件中传递数据？

参考答案：props传参

36. vue 弹窗后如何禁止滚动条滚动？

参考答案：

methods : {
   //禁止滚动
   stop(){
        var mo=function(e){e.preventDefault();};
        document.body.style.overflow='hidden';
        document.addEventListener("touchmove",mo,false);//禁止页面滑动
    },
    /***取消滑动限制***/
    move(){
        var mo=function(e){e.preventDefault();};
        document.body.style.overflow='';//出现滚动条
        document.removeEventListener("touchmove",mo,false);
    }
}