![](https://img-blog.csdnimg.cn/direct/c464385849f1450e886afdbe2c559e09.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
vue
文章平均质量分 74
vue相关知识点
YadingLee
这个作者很懒,什么都没留下…
展开
-
v-for 和 v-if 为什么不共存?
因为其实我们只需要渲染2个节点,但是最终还是循环了3次,造成了性能浪费,也就是 v-for 优先级高于 v-if,共存时会造成性能浪费。但是我们会看到,代码会报错:** item 找不到**?却是可以共存的,为什么呢?我们还是拿最简单的代码来分析。不信我们可以看看转换后的产物,跟刚刚是一模一样的!的,真正循环的只有1、3这两个节点,这提高了性能。找不到,大家都知道为啥了吧?,判断为真则正常渲染,判断为假则执行。会先循环,然后在循环中去判断。是在外层的,所以报错说。去计算,然后再去渲染。原创 2024-01-08 14:40:21 · 362 阅读 · 0 评论 -
vue 组件通信-全局事件总线
文章目录前言一、vue2.x 事件总线二、vue3.x 事件总线1. 安装第三方库 mitt2. 注册使用3. 将事件总线注册到 vue 实例4. 派发事件的组件5. 监听事件的组件前言全局事件总线:任意组件间通信。一、vue2.x 事件总线$bus 所有组件都能看的到,所有的vc、vm都能看得到// main.jsnew Vue({ el: '#app', render: h => (App), beforeCreated() { // 安装全局事件总线,$bus就是原创 2022-02-24 14:01:11 · 691 阅读 · 0 评论 -
Vue3.x 的七种组件通信方式
文章目录一、前提二、举一个例子三、使用详情1. Props 方式2. emit 方式3. v-model 方式4. ref 方式5. provide/inject 方式6. 事件总线7. 状态管理器工具总结一、前提本篇文章是全部采用的 这种组合式 API 写法,相当于选项式来说,组合式 API 这种写法更加自由,具体可参考 vue文档 对两种方式的描述。本篇文章将介绍如下七种组件通信方式:● props● emit● v-model● refs● provide / inject● e原创 2022-02-24 13:48:19 · 856 阅读 · 0 评论