摘要: 一、计算属性【computed】 对于任何复杂逻辑,你都应当使用计算属性 是根据依赖关系进行缓存的计算,只有在它的相关依赖发生改变时才会进行更新 默认使用的是getter属性 当一个数据受多个数据影响时,可以使用computed <!-- 复杂运算 --> <div>{{message.split( 阅读全文
posted @ 2023-06-14 10:30 有只小菜猫 阅读(75) 评论(0) 推荐(0)
摘要: 【key 是为 Vue 中 虚拟节点 的唯一标记,通过这个 key,diff 操作可以更准确、更快速】 (1)第一种情况是 v-if 中使用 key。 由于 Vue 会尽可能高效地渲染元素,通常会复用已有元素而不是从头开始渲染。 因此当使用 v-if 来实现元素切换的时候,如果切换前后含有相同类型的 阅读全文
posted @ 2023-06-14 10:07 有只小菜猫 阅读(318) 评论(0) 推荐(0)
摘要: https://www.cnblogs.com/wind-lanyan/p/9061684.html 阅读全文
posted @ 2023-06-14 10:06 有只小菜猫 阅读(30) 评论(0) 推荐(0)
摘要: 一、虚拟DOM 1、概念相关 是一个JavaScript对象,通过对象的方式来表示DOM结构,是对DOM的抽象 以对象的形式来描述真实DOM结构,最终渲染到页面 在每次数据发生变化前,虚拟DOM都会缓存一份,变化之时,现在的虚拟DOM会与缓存的虚拟DOM进 行比较 在vue内部封装了diff算法,通 阅读全文
posted @ 2023-06-14 09:51 有只小菜猫 阅读(516) 评论(0) 推荐(0)
摘要: 一、底层原理 利用 v-bind 用来绑定value的值 用 v-on 去绑定input标准事件 是事件用来监听当输入域内容发生变化的时候来执行一些事情 具体事件: 通过$event这个事件对象获取到最新的输入域的值 把最新的值赋值给旧的值,进行数据更新。 》双向数据绑定 二、如何实现 (1)作用在 阅读全文
posted @ 2023-06-14 09:32 有只小菜猫 阅读(506) 评论(0) 推荐(0)
摘要: 一、组件之间的关系 父子关系、兄弟关系、跨级关系 二、父子之间数据传递 1、父组件向子组件传递【使用 props】 第一步:在父组件中使用子组件时,给子组件绑定属性 第二步:在子组件中使用props接收绑定的属性值 2、子组件向父组件传递【使用 $emit】 第一步:在子组件中通过$emit触发指定 阅读全文
posted @ 2023-06-13 19:57 有只小菜猫 阅读(444) 评论(0) 推荐(0)
摘要: 一、原理 二、流程 第一步,“数据劫持” vue 2.x 用 Object.defineProperty() 方法来实现数据劫持,为每个属性分配一个 订阅者集合的管理数组 dep vue 3.x 用 ES6 的 Proxy 构造函数来实现数据劫持。 第二步,“添加订阅者” 在编译的时候在该属性的数组 阅读全文
posted @ 2023-06-13 17:36 有只小菜猫 阅读(50) 评论(0) 推荐(0)
摘要: 一、区别 二、SPA单页面 阅读全文
posted @ 2023-06-13 17:31 有只小菜猫 阅读(28) 评论(0) 推荐(0)
摘要: 1.共同点 在 vue 中 v-show 与 v-if 的作用效果是相同的 当表达式都为 false 时,都不会占据页面位置 当表达式结果为 true 时,都会占据页面的位置 2.不同点 阅读全文
posted @ 2023-06-13 17:26 有只小菜猫 阅读(58) 评论(0) 推荐(0)
摘要: 1、概念相关 列表页面 ——进入详情页 —— 后退到列表页(缓存列表页的原来数据以及滚动位置) 重新进入列表页面,获取最新的数据 2、实现 3、钩子函数 当组件被激活时,触发钩子函数 activated 当组件被移除时,触发钩子函数 deactivated 阅读全文
posted @ 2023-06-13 17:17 有只小菜猫 阅读(63) 评论(0) 推荐(0)