实现: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同级组件之前方法调用的更多相关文章

  1. vue 父子组件的方法调用

    $emit 子组件触发父组件的方法: <!-- 子组件 --> <template> <div id="child"> <button @ ...

  2. vue 子组件 $emit方法 调用父组件方法

    $emit方法 父组件 <template> <div> <child @callFather="activeSon"></child&g ...

  3. seventBus(封装) 一个巧妙的解决vue同级组件通讯的思路

    如果在你项目中需要多处用到同级组件通讯,而又不想去写繁琐的vuex,可以参考这个小思路.本人在写项目中琢磨出来的,感觉挺好用,分享一下. 1.在utils文件夹下添加BusEvent.js 注释已经很 ...

  4. Vue组件传值方法调用

    1.子组件改变父组件的值 <father  label="云盘快照" name="name2"> <son :props='rows'   @ ...

  5. vue入坑教程(三)vue父子组件之间互相调用方法以及互相传递数据

    1.父组件调用子组件的方法 父组件: <template> <div> <button v-on:click="clickParent">点击& ...

  6. vue中methods一个方法调用另外一个方法

    转自http://blog.csdn.net/zhangjing1019/article/details/77942923 vue在同一个组件内: methods中的一个方法调用methods中的另外 ...

  7. vue.js---methods中一个方法调用另一个方法

    new Vue({ el: '#app', data: { test:111, }, methods: { test1:function(){ alert(this.test) }, test2:fu ...

  8. Vue.js组件之间的调用

    index.html: <div id="app"></div> 运行完index.html之后自动寻找运行main.js文件 main.js: impor ...

  9. vue全局组件-父子组件传值

    全局组件注册方式:Vue.component(组件名,{方法}) demo: 子组件:upload.vue <template> <div > <div class=&q ...

  10. vue组件之间的通信以及如何在父组件中调用子组件的方法和属性

    在Vue中组件实例之间的作用域是孤立的,以为不能直接在子组件上引用父组件的数据,同时父组件也不能直接使用子组件的数据 一.父组件利用props往子组件传输数据 父组件: <div> < ...

随机推荐

  1. VUE3、ElementPlus 重构若依vue2 表单构建功能

    Vue3 + ElementPlus + Vite 重构 若依Vue2 表单构建功能 若依官方的Vue3 版本发布已经有段时间了,就是这个表单构建功能一直没有安排计划去适配到Vue3! 前段时间公司需 ...

  2. DirtyCow 脏牛提权漏洞(CVE-2016-5195)

    描述: 该漏洞是 Linux 内核经典漏洞,内核内存子系统在处理写时拷贝(Copy-on-Write)时存在条件竞争漏洞, 导致可以破坏私有只读内存映射.黑客可以在获取低权限的的本地用户后,利用此漏洞 ...

  3. 【技术实战】Vue功能样式实战【七】

    需求实战一 样式展示 代码展示 <template> <transition name="fade-in" appear> <ARow v-if=&q ...

  4. 《Kali渗透基础》03. 被动信息收集

    @ 目录 1:被动信息收集 1.1:收集内容 1.2:信息用途 2:域名信息收集 2.1:nslookup 2.1.1:命令参数 2.1.2:示例 - 命令行 2.1.3:示例 - 交互式 2.2:d ...

  5. 从 DMAIC 方法论说起,记一个长链接 bug 的排查全过程

    引 本文是我在前端团队的第四次分享,在过去我曾做过一次关于 bug 排查的全流程的排查分析,文档:客户线上反馈:从信息搜集到疑难 bug 排查全流程经验分享,但这个文章更侧重我过去几年的排查经验,而非 ...

  6. 加密 K8s Secrets 的几种方案

    前言 你可能已经听过很多遍这个不算秘密的秘密了--Kubernetes Secrets 不是加密的!Secret 的值是存储在 etcd 中的 base64 encoded(编码) 字符串.这意味着, ...

  7. 对某个接口进行限流 以 Aop 注解的形式绑定接口 用redis实现

    简单的针对某个接口进行限流,如果需要整体限流的话还是建议在网关上面或者服务器上面动手Controller: @LimitRequest(count = 1,time = 60 * 1000 * 2) ...

  8. ModbusTCP 转 Profinet 主站网关在博图配置案例

    ModbusTCP 转 Profinet 主站网关在博图配置案例 兴达易控ModbusTCP转Profinet网关,在 Profinet 侧做为 Profinet 主站控制器,接 Profinet 设 ...

  9. Three.js中实现一个OBBHelper

    1. 引言 Three.js中,Box3对象指的是AABB式的包围盒,这种包围盒会随物体的旋转而变换大小,精度较差 Three.js中还有OBB对象,这是一种能表现物体主要特征的.不随物体的旋转而变换 ...

  10. oracle clob字段信息读取,不限字符长度

    在项目中,经常需要在plsql中查询clob的内容,提供以下两种方法: 第一种,oracle常规函数,限制文本在4000以内 select dbms_lob.substr(sql_text) from ...