const eventBus = { install(Vue,options) { Vue.prototype.$bus = vue } }; Vue.use(eventBus); methods: { //分发事件 todo: function () { this.$bus.$emit('todo
原创
2021-12-28 14:59:42
96阅读
最近在看他人vue项目中发现别人使用了$bus,感觉使用很方便 查了查，bus主要是解决无关系组件之间的交互问题，当然父子组件我们可以通过自定义事件来交互（子传父） 另外一种解决无关系组件间的交互问题就是使用vuex，也很方便。 那么bus最主要的是无关系组件间的交互响应，相当于父子组件的自定义事件 Read More
转载
2020-04-15 14:09:00
130阅读
2评论
场景：有时候两个组件也需要通信（非父子关系）。当然Vue2.0提供了Vuex，但在简单的场景下，可以使用一个空的Vue实例作为中央事件总线。Bus.jsimport Vue from 'vue'const Bus = new Vue()export default Bus组件调用时先引入组件1import Bus from './Bus'export default { data() {
原创
2023-03-15 00:03:11
113阅读
面试官：vue中传值有哪几种类型的？ 我：父组件到子组件传值，子组件到父组件，子组件到子组件面试官：能具体说说吗？ 我：父到子是prop，prop包括数组类型和对象类型，对象类型就是指定传值类型，用来做数据类型验证，子到父是emit,而父组件监听emit,而父组件监听emit,而父组件监听emit触发的事件，那子到子呢？可以采用中央总线bus或者是vuex...
原创
2021-04-29 13:56:59
717阅读
vue总线机制(bus) vue中非父子组件之间通信除了使用vuex，也可以通过bus总线，两者适用场景不同。 bus适合小项目、数据被更少组件使用的项目，对于中大型项目 数据在很多组件之间使用的情况 bus就不太适用了。bus其实就是一个发布订阅模式，利用vue的自定义事件机制，在触发的地方通过$ ...
转载
2021-04-12 23:26:47
766阅读
2评论
vue总线机制(bus)vue中非父子组件之间通信除了使用vuex，也可以通过bus总线，两者适用场景不同。bus适合小项目、数据被更少组件使用的项目，对于中大型项目 数据在很多组件之间使用的情况 bus就不太适用了。bus其实就是一个发布订阅模式，利用vue的自定义事件机制，在触发的地方通过$emit向外发布一个事件,在需要监听的页面，通过$on监听事件。vuex适用中大型项目、数据在多组件之间
转载
2021-05-10 16:47:01
215阅读
2评论
关于组件通信我相信小伙伴们肯定也都很熟悉，就不多说了，对组件通信还不熟悉的小伙伴移步这里。 在vue2.0中 $dispatch 和 $broadcast 已经被弃用。官方文档中给出的解释是： 因为基于组件树结构的事件流方式实在是让人难以理解，并且在组件结构扩展的过程中会变得越来越脆弱。这种事件方式
转载
2018-11-14 21:00:00
97阅读
2评论
<Child @get-time="getTime" />
<input v-model="data" />
<p>{{ time }}</p>
</div>效果图
![在这里插入图片描述]()
改变后
![在这里插入图片描述]()
详情可看官网[自定义事件]( )
关于父子组件传值遇到
vue3的bus通信
原创
2023-12-11 13:44:15
352阅读
点赞
vue中的参数传递方式有父子组件中通过props，$emit互相传递event bus事件总线vuex第一种局限于只能在父子组件中传递，如果要在兄弟组件之间传递就要用到事件总线event bus或者vuex来实现。这里讨论的是event bus这种实现方式。首先创建一个简单的应用
src/router/index.js路由import Vue from 'vue'
import Router fr
转载
2021-01-20 15:11:29
609阅读
2评论
# 实现vue uniapp jquery
## 一、整体流程
首先我们需要明确整个实现过程，下面是实现“vue uniapp jquery”的步骤表格：
```mermaid
journey
title 实现“vue uniapp jquery”流程表格
section 步骤
开始 --> 下载uni-app项目模板: uni-app官网下载
原创
2024-06-12 05:57:18
32阅读
折叠侧边栏为例 1 <el-aside :width="isCollapse?'10px':'200px'"> 2 <el-menu :default-active="this.$route.path" unique-opened router :collapse="isCollapse"> 3 < ...
转载
2021-10-15 17:46:00
453阅读
2评论
项目中难免都会用到vuex，下面我总结了一下在uni-app中如何使用vuex首先新建文件store/index.jsimport Vue from "vue"
import Vuex from "vuex"
Vue.use(Vuex)
export default new Vuex.Store({
// 全局属性变量
state:{ // state的作用是定义属性变量
转载
2023-07-28 13:14:20
242阅读
这个mixin的翻版，主要用来分离处理列表数据逻辑 我用了覆写模式 创建mixin ListMoreDataMixin // 由于没有超类的限制这里要判断下 function ____checkGetData(context) { if (!context.getData || typeof con
转载
2020-07-02 17:10:00
1552阅读
2评论
vue中eventbus被多次触发（vue中使用eventbus踩过的坑）【bus.$on事件被多次绑定】问题描述：只要页面没有强制刷新，存在组件切换，bus.$on方法会被多次绑定，造成事件多次触发 触发bus.$on中绑定的方法.png bus.$on多次绑定.png解决办法一：在每次调用方法前先解绑事件( bus.$off )，然后在重新绑定( bus.$on ) 每次绑定前解绑bus.$
转载
2020-04-23 11:27:00
494阅读
2评论
前言uni-app 是 DCloud 出品的新一代跨端框架，可以说是目前跨端数最多的框架之一了，目前支持发布到：App（Android/iOS）、H5、小程序（微信小程序/支付宝小程序/百度小程序/字节跳动小程序），目前市面上类似的框架还有：Taro（京东出品）、Megalo（网易出品）。uni-app 的 nvue 说白了就是 weex 的那一套东西，uni-app 集成了 weex 的 SDK
转载
2024-07-30 15:31:08
169阅读
1.前言uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/QQ/钉钉/淘宝）、快应用等多个平台。2.项目创建项目创建有两种方式：
(1)使用npm创建
(2)使用HbuildX编辑器创建npm创建的具体步骤：1.全局安装vuecli，这个脚手架能帮助快速搭建一个vue项目
转载
2024-03-07 13:21:32
118阅读
之前的config配置，git更新后，config服务端可自动刷新，而所有的config客户端需
原创
2022-10-01 07:56:31
14阅读
前言学生工作的前提是不能影响个人情绪与生活，嗯！不能用他们的问题惩罚自己，冲吧！我已经忘了总线有啥了QAQ，还有问题就是课上做的笔记没有及时整理，现在就有点迷了！0. 总线概述总线：信息传输的多个部件所互连的一组公共信号通路和计算机系统的互连机构。根据传输方式的不同，总线可以分为如下两类：并行总线：多条线同时传递所有的二进制数位。性能好，适用于近距离传输。串行总线：多位二进制信息公用一位信号线。成本低，适用于远距离。而根据总线位置的不同，总线可以分为如下几类：内部总线：CPU内部.
原创
2021-11-22 17:44:50
496阅读
一、Vue 3 核心优化点 1. Composition API 的艺术逻辑复用：用 setup() + ref/reactive 替代 Options API，将业务逻辑拆解为自定义 Hook（如 useRequest.js），代码可维护性提升50%+性能对比：在长列表渲染场景中，Composition API 的响应式系统比 Vue 2 快约&
