vue eventBus使用
类似于iframe之间的possMessage方式传参
1、eventBus.js文件
//用于兄弟组件通信
import Vue from 'vue';
export default new Vue();
2、页面开启监控
import Bus from '../../../eventBus.js'
mounted(){
//被调用方法,先保存数据,在回调方法
var _this = this;
Bus.$off('ComputeSubStep');
Bus.$on('ComputeSubStep', function (callback) {
_this.DefaultDataCommon(function () {
if (typeof callback == "function") {
callback();
}
});
});
},
3、其他页面调用
methods: {
//页面转被跳转,调用兄弟组件方法
ComputeStep(expoolid, exid, index){
var _this = this;
Bus.$emit('ComputeSubStep', function () {
_this.$router.push({path: `/ComputeStep/${expoolid}/${exid}/${index}`})
});
},
}
vue eventBus使用的更多相关文章
- vue eventBus 跳坑的办法
前言(feihua): 最近闲来没事写了一个小的demo,在小的数据传输上没有必要去使用vuex,对于非父子组件的传值方法总结了一点心得体会供大家参考(如有太low,还请大神别喷俺) 先上官方文档: ...
- 13.vue组件
vue组件(一) 组件嵌套: 1.全局嵌套: <!doctype html> <html> <head> <meta charset="utf-8& ...
- vue组件知识总结
vue组件化开发 将一个页面分割成若干个组件,一个页面js+css+html,将自己类容分割出来,方便开发,更好了维护我们的代码,每个组件封装自己的js+html+css,样式命名冲突 组件分类 页面 ...
- vue项目的一些最佳实践提炼和经验总结
项目组织结构 ajax数据请求的封装和api接口的模块化管理 第三方库按需加载 利用less的深度选择器优雅覆盖当前页面UI库组件的样式 webpack实时打包进度 vue组件中选项的顺序 路由的懒加 ...
- 事件总线(EventBus)
Vue.prototype.$EventBus = new Vue() 不建议用,尽量用vuex,eventbus过于消耗浏览器资源 傻瓜版状态管理 一般的状态传递是在同时显示的情况下,倘若是在不同时 ...
- React / Vue 跨端渲染原理与实现探讨
跨端渲染是渲染层并不局限在浏览器 DOM 和移动端的原生 UI 控件,连静态文件乃至虚拟现实等环境,都可以是你的渲染层.这并不只是个美好的愿景,在今天,除了 React 社区到 .docx / .pd ...
- vue + typescript,定义全局变量或者方法
众所周知,在 vue中,如果想定义一个全局变量的方法很简单,直接在 vue的原型上挂载属性或者方法即可. 但是,加上了typescript之后, Vue.prototype.$xxx = xxx 这 ...
- js 整理 前端知识点 前端面试题 (2020)(vue)
数据类型 字符串(String).数字(Number).布尔(Boolean).对空(Null).未定义(Undefined).Symbol. 引用数据类型:对象(Object).数组(Array). ...
- JavaScript中的原型、原型链、原型模式
今天,咱来聊聊JavaScript中的原型跟原型链 原型跟原型模式 这一块的知识,主要是设计模式方面的. 首先,我们知道JavaScript是面向对象的.既然是面向对象,那它自然也有相应的类跟对象等概 ...
随机推荐
- php通过phpize安装扩展
//下载libevent扩展文件压缩包(在当前系统哪个目录下载随意) ~# wget http://pecl.php.net/get/libevent-0.1.0.tgz //解压文件 ~# tar ...
- ubuntu装好jupyter启动失败问题
::/jupyter/nbserver-.json: [Errno ] Permission denied: '/run/user/1000/jupyter/nbserver-35390.json' ...
- JavaScript之基础语法整理
1.数据类型(number,boolean,string,null,undefined,symbol,object) es是动态语言,弱类型语言,虽然先声明了变量,但是变量可以重新赋值任意类型 弱类型 ...
- 279. Perfect Squares(动态规划)
Given a positive integer n, find the least number of perfect square numbers (for example, 1, 4, 9, 1 ...
- hdu4779 组合计数+dp
提交 题意:给了n*m的网格,然后有p个重型的防御塔,能承受1次攻击,q个轻型防御塔不能接受任何攻击,然后每个防御搭会攻击他所在的行和所在的列,最后求在这个网格上放至少一个防御塔的方案数, 我们枚举 ...
- CSS图形
1.正方形 最终效果: CSS代码如下: #square { width: 100px; height: 100px; background: red; } 2.长方形 最终效果: CS ...
- CentOS6.5 切换 图形界面 与 命令行界面
CentOS6.5 切换图形界面与命令行界面 [1]场景1:图形界面 -> 命令行界面 方式一(快捷键):Ctrl + Alt + F2 方式二(终端命令):init 3 (PS:init与3之 ...
- liunx驱动----构造和运行模块
以hello world模块为例 #include <linux/init.h> #include <linux/module.h> //在执行 insmod hlello 的 ...
- 在自定义目录下,按日期创建excel文件
在指定文件目录下,新建以当前日期命名的excel 文件,如果文件已经存在,在文件中新建一个sheet页来存放数据 import datetime import xlrd, xlwt import re ...
- 1.4:SubShader
文章著作权归作者所有.转载请联系作者,并在文中注明出处,给出原文链接. 本系列原更新于作者的github博客,这里给出链接. 在了解了渲染流水线之后,我们可以开始SubShader的学习了. 什么是S ...