Vue.js事件中心触发事件时传递值类型参数的疑问

绝对可以！Vue的$emit方法完全支持直接传递字面量（比如你提到的true），监听事件的回调函数能直接接收这个值，根本不需要先把值存在变量里再传递。

给你写个完整的示例，一看就懂：

1. 先创建全局事件中心 #

// 可以放在项目的公共工具文件里，比如utils/eventHub.js
import Vue from 'vue'
export const eventHub = new Vue()

2. 在任意组件中触发事件，直接传字面量true #

import { eventHub } from '@/utils/eventHub.js'

// 比如在某个按钮点击事件里触发
methods: {
  triggerTestEvent() {
    eventHub.$emit('test_emit', true) // 直接传布尔值true
  }
}

3. 在目标组件中监听并接收值 #

import { eventHub } from '@/utils/eventHub.js'

export default {
  data() {
    return {
      isActive: false
    }
  },
  created() {
    // 监听test_emit事件，接收传递过来的值
    eventHub.$on('test_emit', (receivedValue) => {
      console.log('收到的值：', receivedValue) // 控制台会输出 true
      this.isActive = receivedValue // 直接用这个值更新组件状态
    })
  },
  beforeDestroy() {
    // 记得在组件销毁时移除监听，避免内存泄漏
    eventHub.$off('test_emit')
  }
}

不止布尔值，你还能直接传递任何类型的数据：

• 字符串：eventHub.$emit('send_msg', '这是直接传递的字符串')
• 对象：eventHub.$emit('update_user', { name: 'Nik', age: 30 })
• 数字或计算结果：eventHub.$emit('count_change', 5 * 6)

监听的回调函数都会准确拿到这些传递过来的内容。这是Vue事件系统的核心特性之一，不管是组件间的自定义事件还是全局EventHub，传递参数的逻辑都是一样的。

内容的提问来源于stack exchange，提问作者niksrb