VUE同级组件之前方法调用
实现:Index.vue页面调用nav.vue页面里的getLeftMenu()方法
一、首先先建一个公共文件,命名eventBus.js,内空为:
import Vue from 'vue'
export default new Vue()
二、在Index.vue和nav.vue都import一下eventBus.js公共文件,具体写法
import bus from './comms/eventBus'
三、在nav.vue里的mounted方法里加上
bus.$on('navLeft',function(){
that.getLeftMenu();
});
四、在Index.vue页面里的methods具体方法里定义emit事件,具体写法
goUrl(url){//页面跳转
this.$router.push(url);
bus.$emit('navLeft',url);
}
原文链接:https://blog.csdn.net/zhangjie9852/article/details/103200635
VUE同级组件之前方法调用的更多相关文章
- vue 父子组件的方法调用
$emit 子组件触发父组件的方法: <!-- 子组件 --> <template> <div id="child"> <button @ ...
- vue 子组件 $emit方法 调用父组件方法
$emit方法 父组件 <template> <div> <child @callFather="activeSon"></child&g ...
- seventBus(封装) 一个巧妙的解决vue同级组件通讯的思路
如果在你项目中需要多处用到同级组件通讯,而又不想去写繁琐的vuex,可以参考这个小思路.本人在写项目中琢磨出来的,感觉挺好用,分享一下. 1.在utils文件夹下添加BusEvent.js 注释已经很 ...
- Vue组件传值方法调用
1.子组件改变父组件的值 <father label="云盘快照" name="name2"> <son :props='rows' @ ...
- vue入坑教程(三)vue父子组件之间互相调用方法以及互相传递数据
1.父组件调用子组件的方法 父组件: <template> <div> <button v-on:click="clickParent">点击& ...
- vue中methods一个方法调用另外一个方法
转自http://blog.csdn.net/zhangjing1019/article/details/77942923 vue在同一个组件内: methods中的一个方法调用methods中的另外 ...
- vue.js---methods中一个方法调用另一个方法
new Vue({ el: '#app', data: { test:111, }, methods: { test1:function(){ alert(this.test) }, test2:fu ...
- Vue.js组件之间的调用
index.html: <div id="app"></div> 运行完index.html之后自动寻找运行main.js文件 main.js: impor ...
- vue全局组件-父子组件传值
全局组件注册方式:Vue.component(组件名,{方法}) demo: 子组件:upload.vue <template> <div > <div class=&q ...
- vue组件之间的通信以及如何在父组件中调用子组件的方法和属性
在Vue中组件实例之间的作用域是孤立的,以为不能直接在子组件上引用父组件的数据,同时父组件也不能直接使用子组件的数据 一.父组件利用props往子组件传输数据 父组件: <div> < ...
随机推荐
- RobotFrameWork环境搭建及使用
RF环境搭建 首先安装python并且配置python环境变量 pip install robotframework pip install robotframework-ride 生产桌面快捷方式 ...
- cesium中限制地图浏览范围
https://blog.csdn.net/qq_42740164/article/details/119375782?ops_request_misc=%257B%2522request%255Fi ...
- PB从入坑到放弃(六)动态SQL应用
写在前面 动态 SQL 语句是部分或者整个 SQL 语句在运行时才能确定,可以更好的与用户进行交互,大大提高了SQL的灵活性 一.执行SQL语句 1.1 执行无入参SQL ① 语法 EXECUTE I ...
- __wakeup()魔术方法绕过(CVE-2016-7124)
__wakeup()魔术方法绕过(CVE-2016-7124) 漏洞简介 在php反序列化数据过程中,如果类中存在__wakeup方法,调用 unserilize() 方法前则先调用__wakeup方 ...
- call与retn指令
一. call指令 将call指令下一跳指令压入栈中 jmp跳转到call指令的地址 二. retn指令 pop指令将栈顶元素弹出存储 jmp跳转到该栈顶元素地址 retn n;表示再前两步操作的基础 ...
- 10、Spring之AOP概述
10.1.概念 AOP(Aspect Oriented Programming)是一种设计思想,是软件设计领域中的面向切面编程 AOP是面向对象编程(OOP)的一种补充和完善,OOP是纵向继承机制,A ...
- Programming abstractions in C阅读笔记:p130-p131
<Programming Abstractions In C>学习第52天,p130-p131,总结如下: 一.技术总结 1. pig latin game 通过pig latin gam ...
- Nomad 系列-安装
系列文章 Nomad 系列文章 Nomad 简介 开新坑!近期算是把自己的家庭实验室环境初步搞好了,终于可以开始进入正题研究了. 首先开始的是 HashiCorp Nomad 系列,欢迎阅读. 关于 ...
- YShow性能测试平台搭建
ShowSlow安装 ShowSlow是一个YSlow性能数据收集平台,用于将收集的性能数据 ShowSlow是用php实现的,所以我们需要搭建一台服务器来接收YSlow数据 我搭建的环境是:ubun ...
- 精选版:用Java扩展Nginx(nginx-clojure 入门)
欢迎访问我的GitHub 这里分类和汇总了欣宸的全部原创(含配套源码):https://github.com/zq2599/blog_demos 本篇概览 今天咱们以Java程序员的视角,来聊聊如何用 ...