Vue嵌套v-for场景下如何将选中的dropdown-item ID传入多个方法使用

通常有两种成熟的实现思路，你可以根据你的业务场景选择：

方案1：组件响应式变量存储（通用方案） #

适合 anotherFunction 是独立触发的场景：比如点击页面其他按钮、接口回调等和下拉点击事件不直接关联的场景。

1. 先在组件 data 中新增变量存储选中的ID：

data() {
  return {
    // 你原本的其他data变量
    selectedDropdownId: null // 新增，默认可设为null/空字符串
  }
}

2. 修改inputDropdown方法，把选中的ID存到响应式变量：

methods: {
  inputDropdown(ID) {
    this.selectedDropdownId = ID
    // 原本的业务逻辑
  },
  anotherFunction() {
    // 直接取存储的ID即可使用
    const usedId = this.selectedDropdownId
    // 可以加非空判断避免未选中时报错
    if (!usedId) return
    // 你原本的业务逻辑
  }
}

方案2：方法调用时直接传参 #

适合 anotherFunction 是下拉点击后顺次执行的场景，不需要额外加响应式变量：

methods: {
  inputDropdown(ID) {
    // 原本的业务逻辑
    this.anotherFunction(ID) // 直接把ID作为参数传入
  },
  anotherFunction(ID) {
    // 直接使用传入的ID即可
    // 你原本的业务逻辑
  }
}

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