element ui Popover多个点击按钮开启关闭

实现多个点击按钮开启关闭 Popover 可以通过以下方式实现：在每个按钮上绑定一个方法，然后在这个方法中调用 `$refs.popover.toggle()` 来切换 Popover 的显示状态。具体实现代码如下：

<template>
  <div>
    <el-button ref="btn1" @click="togglePopover">按钮1</el-button>
    <el-button ref="btn2" @click="togglePopover">按钮2</el-button>
    <el-popover ref="popover" placement="bottom" width="200">
      <p>这是 Popover 的内容</p>
    </el-popover>
  </div>
</template>

<script>
export default {
  methods: {
    togglePopover() {
      this.$refs.popover.toggle()
    }
  }
}
</script>

在以上代码中，我们在每个按钮上都绑定了 `togglePopover` 方法，这个方法中调用了 `$refs.popover.toggle()` 来切换 Popover 的显示状态。这样无论用户点击哪个按钮，都能够切换 Popover 的显示状态。

相关问题

element ui Popover多个点击按钮关闭

可以通过以下方式实现：在多个点击按钮上绑定同一个方法，然后在这个方法中调用 `$refs.popover.close()` 来关闭 Popover。具体实现代码如下：

<template>
  <div>
    <el-button ref="btn1" @click="closePopover">按钮1</el-button>
    <el-button ref="btn2" @click="closePopover">按钮2</el-button>
    <el-popover ref="popover" placement="bottom" width="200">
      <p>这是 Popover 的内容</p>
    </el-popover>
  </div>
</template>

<script>
export default {
  methods: {
    closePopover() {
      this.$refs.popover.close()
    }
  }
}
</script>

在以上代码中，我们在两个按钮上都绑定了 `closePopover` 方法，这个方法中调用了 `$refs.popover.close()` 来关闭 Popover。这样无论用户点击哪个按钮，都能够关闭 Popover。