2022年6月23日
元素水平垂直居中的方式有哪些
摘要： absolute加margin方案 div{ position: absolute; width: 100px; height: 100px; left: 50%; top: 50%: margin-top: -50px; margin-left: -50px; } fixed 加 margin 方 阅读全文
posted @ 2022-06-23 20:00 bug制造者~~ 阅读(39) 评论(0) 推荐(0) 编辑
nextTick的使用和原理
摘要： 1、nextTick是等待下一次DOM更新刷新的方法 2、Vue有个异步更新策略，意思是如果数据变化，Vue不会立刻更新DOM,而是开启一个队列，把组件更新函数保存在队列中，在同一事件循环中发生的所有数据变更会异步的批量更新。这一策略导致我们对数据的修改不会立刻体现在DOM上，此时如果想要获取更新后 阅读全文
posted @ 2022-06-23 19:52 bug制造者~~ 阅读(453) 评论(0) 推荐(0) 编辑
vue组件为什么只能有一个根节点？
摘要： vue2中只能有一个根标签，但是在vue3中根组件已经可以有多个根节点了 在vue2中只所以这么做是因为vdom是一颗单根树形结构，patch方法在遍历的时候从根节点开始遍历，它要求只有一个根节点，组件也会转换为一个vdom,自然满足这个要求 vue3中值所以可以有多个节点，是因为引入了Fragme 阅读全文
posted @ 2022-06-23 19:33 bug制造者~~ 阅读(789) 评论(0) 推荐(0) 编辑
2022年6月22日
Watch,computed和methods的区别
摘要： watch是监听某个变量或者属性的变化，并执行相应的回调函数，通常是一个变量的变化决定多个变量的变化，watch可以进行异步操作，但不支持缓存。一个侦听器对应一条数据，当侦听的数据发生变化是，watch才会执行对应的方法（一对一） computed计算属性是依赖已有的变量来计算一个目标变量，大多数情 阅读全文
posted @ 2022-06-22 19:45 bug制造者~~ 阅读(131) 评论(0) 推荐(1) 编辑
对vue响应式的理解
摘要： 1、所谓数据响应式就是能够使数据变化可以被检测并对这种变化做出响应的机制。 2、MVVM框架要解决的一个核心问题是连接数据层和视图层，通过数据驱动应用，数据变化，视图更新，要做到这点的就需要对数据做响应式处理，这样一旦数据发生变化就可以立即做出更新处理。 3、以vue为例说明，通过数据响应式加上虚拟 阅读全文
posted @ 2022-06-22 19:22 bug制造者~~ 阅读(727) 评论(0) 推荐(0) 编辑
vue性能优化方法
摘要： 路由懒加载：有效拆分App尺寸，访问时才异步加载 keep-alive组件缓存：避免重复创建组件实例，且能保留缓存组件状态 使用v-show复用DOM:避免重复创建组件 v-for遍历避免同时使用v-if 长列表性能优化：如果是大数据长列表，可采用虚拟滚动（不会将所有内容渲染，只是把可是区域渲染）， 阅读全文
posted @ 2022-06-22 19:18 bug制造者~~ 阅读(220) 评论(0) 推荐(0) 编辑
v-if和v-for哪个优先级更高？
摘要： 首先在实际开发阶段，不应该把v-if和v-for在同一个标签中使用， 在vue2中，v-for的优先级是高于v-if的，如果同时出现，每次渲染都会先执行循环再判断条件，无论如何循环都不可避免，浪费了性能；另外需要注意的是在vue3则完全相反，v-if的优先级高于v-for,所以v-if执行时，它调用 阅读全文
posted @ 2022-06-22 19:14 bug制造者~~ 阅读(450) 评论(0) 推荐(0) 编辑
2022年6月21日
vue2和vue3生命周期的区别
摘要： 概念 首先，我们了解一下"生命周期"这个词。通俗的来说，生命周期就是一个事务从出生到消失的过程。例如，一个人从出生到去世。在vue中，vue的生命周期是指，从创建vue对象到销毁vue对象的过程。 vue2生命周期：（8个阶段） beforeCreate(创建前) created(创建后) befo 阅读全文
posted @ 2022-06-21 20:29 bug制造者~~ 阅读(2878) 评论(0) 推荐(0) 编辑
2022年6月20日
MVVM，MVC，MVP的区别
摘要： MVC、MVP 和 MVVM 是三种常见的软件架构设计模式，主要通过分离关注点的方式来组织代码结构，优化开发效率。 在开发单页面应用时，往往一个路由页面对应了一个脚本文件，所有的页面逻辑都在一个脚本文件里。页面的渲染、数据的获取，对用户事件的响应所有的应用逻辑都混合在一起，这样在开发简单项目时，可能 阅读全文
posted @ 2022-06-20 19:58 bug制造者~~ 阅读(97) 评论(0) 推荐(0) 编辑
数组去重的方法
摘要： 1，双重for循环 var arr = [1, 2, 3,4 ,5,6, 4, 3, 8, 1] // 数组去重： // 方法1： 双重for 循环 function newArrFn (arr) { // 创建一个新的空数组 let newArr = [] for(let i = 0;i<arr. 阅读全文
posted @ 2022-06-20 19:34 bug制造者~~ 阅读(78) 评论(0) 推荐(0) 编辑