vue2 面试题

news/2024/9/23 10:05:28/

一、.vue的性能优化怎么做?

1.编码优化:

  • 不要把所有的数据都放在data中;
  • v-for时给每个元素绑定事件用事件代理;
  • keep-alive缓存组件;
  • 尽可能拆分组件,提高复用性、维护性;
  • key值要保证唯一;
  • 合理使用路由懒加载,异步组件;
  • 数据持久化存储的使用尽量防抖、节流优化;

 2.加载优化:

  • 按需加载;
  • 内容懒加载;
  • 图片懒加载;       

3.用户体验:

  • 骨架屏 

4.SEO优化:

  • 预渲染;
  • 服务端渲染ssr; 

5.打包优化:

  •  CDN形式加载第三方模块;
  • 多线程打包;
  • 抽离公共文件;

6.缓存和压缩:

  • 客户端缓存、服务端缓存;
  • 服务端gzip压缩; 

 二、vue3和vue2有哪些区别?

1.双向数据绑定的原理不同;

2.是否支持碎片;

3.API不同;

4.定义数据变量方法不同;

5.生命周期的不同;

6.传值不同;

7.指令和插槽不同;

8.mian.js不同;

三、 vue中如何做强制刷新?

1.localtion.reload();

2.this.$router.go(0);

3.provide和inject;

四、vue的过滤器怎么使用?

用来对文本进行格式化处理,使用方式有两种,一个是插值表达式;一个是v-bind;

分为:

全局过滤器:

javascript">Vue.filter('add',function(v){return v < 10 ? '0'+v : v
})
<div>{{33 | add}}</div>

 局部过滤器:

和methods同级,

javascript">filter:{add:function(v){return v < 10 ? '0'+v : v}
}​

五、封装一个可复用的组件,需要满足什么条件?

1.低耦合,组件之间的依赖越小越好;

2.从父级传入信息,不要在公共组建中请求数据;

3.传入的数据要进行效验;

4.处理事件的方法写在父组件中;

六、如何封装一个组件?

1.使用Vue.extend()创建一个组件;

2.使用Vue.component()方法注册组件;

3.如果子组件需要数据,可以在props中接收定义;

4.子组件修改好数据,要把数据传递给父组件,可以用emit()方法;

原则:

        把功能拆开;

        尽量让组件原子化,一个组件做一件事情;

        容器组件管数据,展示组件管视图;

七、vuex的响应式处理?

vuex是vue的状态管理工具。

vue中可以直接触发methods中的方法,vuex是不可以的。处理异步,当触发事件的时候,会通过dispatch来访问actions中的方法,actions中的commit会触发mutations中的方法从而修改state里的值,通过getter把数据更新到视图。

Vue.use(vuex),调用Install方法,通过applyMixin(vue)在任意组件内执行this.$router就可以访问到store对象。

vuex的state是响应式的,借助的就是vue的data,把state存到vue实例组件的data中。

八、vue和jQuery的区别是什么?

1.原理不同:vue是数据绑定,jq先获取dom再处理;

2.着重点不同:vue是数据驱动,jq是着重于页面;

3.操作不同:vue进行了dom操作,我们只需关注数据即可,jq先获取dom对象,然后赋值,事件绑定等;

        


http://www.ppmy.cn/news/1463699.html

相关文章

基于SpringBoot+Vue在线动漫信息平台设计和实现(源码+LW+部署讲解)

&#x1f339;作者主页&#xff1a;青花锁 &#x1f339;简介&#xff1a;Java领域优质创作者&#x1f3c6;、Java微服务架构公号作者&#x1f604; &#x1f339;简历模板、学习资料、面试题库、技术互助 &#x1f339;文末获取联系方式 &#x1f4dd; &#x1f339;推荐一个人…

1. lambda初体验

首先声明一个函数式接口&#xff0c;就只接口内只有一个抽象方法 //函数式接口 public interface Factory {Object getObject();}接口实现类 public class SubClass implements Factory {Overridepublic Object getObject() {return new User();}}User类 public class User …

详解 QtAndroid::requestPermissionsSync

QtAndroid::requestPermissionsSync 是 Qt 框架中用于在 Android 平台上同步请求运行时权限的函数。这个函数在 Qt for Android 的某个更新中被引入&#xff0c;以更好地支持 Android 6.0&#xff08;API 级别 23&#xff09;及以上版本引入的动态权限管理系统。下面是对该函数…

swiftui基础组件Image加载图片,以及记载gif动图示例

想要在swiftui中展示图片&#xff0c;可以使用Image这个组件&#xff0c;这个组件可以加载本地图片和网络图片&#xff0c;也可以调整图片大小等设置。先大概看一下Image的方法有哪些可以用。 常用的Image属性 1.调整图像尺寸&#xff1a; 使用 resizable() 方法使图像可调整…

Linux 系统的目录和文件管理

一、目录结 目录 一、目录结构和每个目录的作用 二、基本命令 1.分页查看more tail 命令 wc命令grep | 管道符 打包和解包 以及vim的用法 vim 文本编辑器单行替换 一、目录结构和每个目录的作用 二、基本命令 1.分页查看more tail 命令 wc命令 grep | 管道符 …

shell中编写备份数据库脚本(使用mysqldump工具)

mysqldump备份 目录 mysqldump备份 分库备份 分表备份 利用自带工具mysqldump 实现数据库分库分表备份。 要想知道需要备份哪些数据库&#xff0c;就得先列出来 mysql -uroot -pOpenlab123! -N -e show databases | egrep -on_schema|mysql|performance_schema|sys" …

Linux漏洞SSL/TLS协议信息泄露漏洞(CVE-2016-2183) - 非常危险(7.5分) 解决办法!升级openssl

漏洞情况 详细描述 TLS是安全传输层协议&#xff0c;用于在两个通信应用程序之间提供保密性和数据完整性。 TLS, SSH, IPSec协商及其他产品中使用的IDEA、DES及Triple DES密码或者3DES及 Triple 3DES存在大约四十亿块的生日界&#xff0c;这可使远程攻击者通过Sweet32攻击&…

【数据结构】排序详解(希尔排序,快速排序,堆排序,插入排序,选择排序,冒泡排序)

目录 0. 前情提醒&#xff1a; 1. 插入排序 1.1 基本思想&#xff1a; 1.2 直接插入排序 实现步骤&#xff1a; 动图演示&#xff1a; 特性总结&#xff1a; 代码实现&#xff1a; 1.3 希尔排序&#xff08;缩小增量排序&#xff09; 基本思想&#xff1a; 步骤演示&…