首页 > 其他分享 >同一个父组件,兄弟组件相互传参,调用

同一个父组件,兄弟组件相互传参,调用

时间:2022-08-22 10:33:05浏览次数:66  
标签:传参 调用 brother1 handler import 组件 tabNum

组件brother2想调用组件brother1的方法,并传参

可以新建一个handler.js文件

import Vue from 'vue';

export default new Vue(); 
brother1组件方法:
import handler from './handler';
methods: {
    handleEmit () {
      console.log('tabNum',this.tabNum)
      handler.$emit('changeActiveItem', this.tabNum);
    }
  }
brother2组件调用:
import handler from './handler'
mounted() {
      // 当页面渲染完成后,监听brother1兄弟组件传递过来的tabNum值
      // 当前组件要保证与brother1兄弟组件的页面tab值保持一致
      handler.$on('changeActiveItem', (tabNum) => {
          console.log('传过来的值',tabNum)
      });
  },

  

 

标签:传参,调用,brother1,handler,import,组件,tabNum
From: https://www.cnblogs.com/yizhenfeng-sandy/p/16611960.html

相关文章

  • vue3动态组件切换
    <template><divclass="goods-tabs"><nav><a@click='toggle("GoodsDetail")':class="{active:componentName==='GoodsDetail'}"href="javascript:;">商品详情</a>......
  • vue中子组件修改父组件中传递的参数的值
    方法一:1<!--父组件代码-->2<template>3<div>4<p>我是父组件</p>5<button@click="handleShowChild"v-show="!isVisibleChild">显示子组件</but......
  • 054_末晨曦Vue技术_处理边界情况之组件之间的循环引用
    组件之间的循环引用点击打开视频讲解更详细假设你需要构建一个文件目录树,像访达或资源管理器那样的。你可能有一个<tree-folder>组件,模板是这样的:<p><span>{{fold......
  • vue学习笔记:组件
    组件是Vue.js最强大的功能之一。组件可以扩展HTML元素,封装可重用的代码,说白了就是一组可以重复使用的模板。组件系统让我们可以用独立可复用的小组件来构建大型应用,几乎任......
  • useEffect用来监听组件间通信——订阅发布失效
    1.在做这个图书订阅管理系统时,遇到一个这样的业务逻辑:就是这样的逻辑::点击设置---》选择书籍---》点击提交按钮--》轮播图展示这是订阅的代码,没有啥问题,页面挂载的......
  • http发送get/post请求,普通传参
    http请求工具类,需引用合适的jarimportorg.apache.http.HttpEntity;importorg.apache.http.client.ClientProtocolException;importorg.apache.http.client.methods......
  • http发送get/post调用,传参为json对象
    1.http请求工具类importcom.alibaba.fastjson.JSONObject;importorg.springframework.http.*;importorg.springframework.http.converter.StringHttpMessageConver......
  • react组件三大核心之一state
    -<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metahttp-equiv="X-UA-Compatible"content="IE=edge"><metaname="viewport"content="wi......
  • Hadoop及其三大组件原理
    Hadoop是什么?由Apache基金会开发的分布式系统基础架构海量数据的存储和分析计算 Hadoop架构历史:1.0HDFS和MapReduce2.0在1.0基础上增加了YARN(任务调度),解放了Ma......
  • X86汇编层面的方法调用。
    本文主要描述了X64下的汇编层面的方法调用。具体来说就是一个C语言的方法被另外一个方法调用,是如果在汇编语言X64的规范中实现的。1.假设有如下C语言文件"test.c"点击......