类似于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使用的更多相关文章

  1. vue eventBus 跳坑的办法

    前言(feihua): 最近闲来没事写了一个小的demo,在小的数据传输上没有必要去使用vuex,对于非父子组件的传值方法总结了一点心得体会供大家参考(如有太low,还请大神别喷俺) 先上官方文档: ...

  2. 13.vue组件

    vue组件(一) 组件嵌套: 1.全局嵌套: <!doctype html> <html> <head> <meta charset="utf-8& ...

  3. vue组件知识总结

    vue组件化开发 将一个页面分割成若干个组件,一个页面js+css+html,将自己类容分割出来,方便开发,更好了维护我们的代码,每个组件封装自己的js+html+css,样式命名冲突 组件分类 页面 ...

  4. vue项目的一些最佳实践提炼和经验总结

    项目组织结构 ajax数据请求的封装和api接口的模块化管理 第三方库按需加载 利用less的深度选择器优雅覆盖当前页面UI库组件的样式 webpack实时打包进度 vue组件中选项的顺序 路由的懒加 ...

  5. 事件总线(EventBus)

    Vue.prototype.$EventBus = new Vue() 不建议用,尽量用vuex,eventbus过于消耗浏览器资源 傻瓜版状态管理 一般的状态传递是在同时显示的情况下,倘若是在不同时 ...

  6. React / Vue 跨端渲染原理与实现探讨

    跨端渲染是渲染层并不局限在浏览器 DOM 和移动端的原生 UI 控件,连静态文件乃至虚拟现实等环境,都可以是你的渲染层.这并不只是个美好的愿景,在今天,除了 React 社区到 .docx / .pd ...

  7. vue + typescript,定义全局变量或者方法

    众所周知,在 vue中,如果想定义一个全局变量的方法很简单,直接在 vue的原型上挂载属性或者方法即可. 但是,加上了typescript之后, Vue.prototype.$xxx = xxx  这 ...

  8. js 整理 前端知识点 前端面试题 (2020)(vue)

    数据类型 字符串(String).数字(Number).布尔(Boolean).对空(Null).未定义(Undefined).Symbol. 引用数据类型:对象(Object).数组(Array). ...

  9. JavaScript中的原型、原型链、原型模式

    今天,咱来聊聊JavaScript中的原型跟原型链 原型跟原型模式 这一块的知识,主要是设计模式方面的. 首先,我们知道JavaScript是面向对象的.既然是面向对象,那它自然也有相应的类跟对象等概 ...

随机推荐

  1. jquery判断字符长度 数字英文算1字符 汉字算2字符

    <input type="text" maxlength="25" oninput="textlength(this)"> &l ...

  2. day20 python常用模块

    认识模块 什么是模块? 常见的场景:一个模块就是一个包含了python定义和声明的文件,文件名就是模块名字加上.py的后缀.     但其实import加载的模块分为四个通用类别: 1 使用pytho ...

  3. vscode小程序代码高亮

    vscode无法识别wxml,wxss语法: wxml文件设置: (1)任意打开一wxml文件,点击下方语言模式选择,这里已关联wxm所以当前显示wxml.默认关联为纯文本或者html或其他语法,点击 ...

  4. 信用评分卡(A卡/B卡/C卡)的模型简介及开发流程|干货

    https://blog.csdn.net/varyall/article/details/81173326 如今在银行.消费金融公司等各种贷款业务机构,普遍使用信用评分,对客户实行打分制,以期对客户 ...

  5. WC.exe【C】

    gitee传送门!!!(电脑打不开github,多次尝试未果,决定先用gitee存着先) 项目要求 wc.exe 是一个常见的工具,它能统计文本文件的字符数.单词数和行数.这个项目要求写一个命令行程序 ...

  6. 【转载】pycharm破解,可使用到2099年.pycharm版本 pycharm-professional-2016.3.1

    1. Pycharm的安装方法,论坛很多,这里就不赘述了.参照:http://blog.csdn.net/qq_29883591/article/details/52664478 2. 下载Pycha ...

  7. Java多线程编程的常见陷阱

    .在构造函数中启动线程 我在很多代码中都看到这样的问题,在构造函数中启动一个线程,类似这样: public class A{ public A(){ ; ; this.thread=new MyThr ...

  8. C博客第02次作业---循环结构

    1.本章学习总结 1.1 思维导图 1.2 本章学习体会及代码量 1.2 本章学习体会及代码量 1.2.1 学习体会 1.这两周的学习懂得了循环结构的使用方法,懂得了在什么时候应该使用循环结构来处理问 ...

  9. oracle数据库更改字符集为utf-8,亲测有效

    >shutdown immediate; (把database停了) >startup mount; (把database重开) >alter system enable restr ...

  10. php,js 对字符串按位异或运算加密解密

    异或的符号是^.按位异或运算, 对等长二进制模式按位或二进制数的每一位执行逻辑按位异或操作. 操作的结果是如果某位不同则该位为1, 否则该位为0. xor运算的逆运算是它本身,也就是说两次异或同一个数 ...