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是面向对象的.既然是面向对象,那它自然也有相应的类跟对象等概 ...
随机推荐
- java消息队列--ActiveMQ
1.下载安装ActiveMQ ActiveMQ官网下载地址:http://activemq.apache.org/download.html ActiveMQ 提供了Windows 和Linux.Un ...
- python模块之re模块
# 正则表达式是用来匹配字符串的方法 # 字符串本身就有匹配方式,为什么要引入正则表达式? 因为原有的字符串匹配不出来原始的方法 # 正则匹配是用来进行模糊匹配的 s = "alex wan ...
- windows中启动和终止nginx的两个批处理
文件:start_nginx.bat 内容: set nginx=D:\nginx-1.9.5\set php=D:\php\start /MIN %nginx%nginx.exestart /MIN ...
- IP通信基础学习第六周(下)
硬件地址又称物理地址或MAC地址 以太网的MAC帧格式开始的标志是有11出现时,没电时自动结束 适配器的重要功能:进行串行/并行转换:对数据进行缓存:在计算机的操作系统安装设备驱动系统:实现以太协议 ...
- vue图片onerror加载路径写法
vue里,img加载错误的时候,onerror属性可以加载错误图片的默认图片写法如下: <img class=avator' :src="data.picture" :one ...
- Porsche Piwis Tester II V15.6 with CF30 Laptop or Lenovo E49AL Laptop
Some of my customers let me recommended which auto diagnostic tool is good for Porsche , I recommend ...
- vue 重构项目第一步(vue-cli跟bootstrap)
一.先安装jq跟bootstrap 1.因为bootstrap依赖jq,先安装jq----->npm install jquery@1.11.3 --save-dev ----->可以 ...
- CodeForces - 468A
Little X used to play a card game called "24 Game", but recently he has found it too easy. ...
- Html5 Page Creator,简易h5页面场景制作
- java导出excel,多表头合并
要求结果图如下: 有空补充具体逻辑 参考:https://blog.csdn.net/dj0721/article/details/72463042 HSSFColor 背景颜色选择 参考:htt ...