element ui点击播放按钮弹出窗口后用html播放器播放音频

要实现这个功能，你可以按照以下步骤操作：

1. 在 Element UI 中添加一个按钮，并在点击事件中调用一个方法。

2. 在该方法中，弹出一个 Element UI 的弹窗，并在弹窗中添加一个 `<audio>` 元素，用于播放音频。

3. 设置 `<audio>` 元素的 src 属性为音频文件的 URL。

4. 在弹窗的底部添加一个关闭按钮，点击该按钮时关闭弹窗。

以下是代码示例：

在模板中添加一个按钮：

<el-button type="primary" @click="playAudio">播放音频</el-button>

在方法中添加弹窗和 `<audio>` 元素：

methods: {
  playAudio() {
    this.$alert('<audio src="audio.mp3" controls></audio>', '播放音频', {
      dangerouslyUseHTMLString: true,
      callback: action => {
        // 弹窗关闭时执行的回调函数
      }
    });
  }
}

在上面的代码中，`$alert` 方法用于弹出一个 Element UI 的弹窗，`dangerouslyUseHTMLString` 属性用于允许在弹窗中使用 HTML 字符串，`<audio>` 元素的 `src` 属性指定要播放的音频文件的 URL，`controls` 属性用于添加音频播放器的控制条，包括播放、暂停、音量等按钮。

最后，在弹窗底部添加一个关闭按钮：

<span slot="footer" class="dialog-footer">
  <el-button @click="closeDialog">关闭</el-button>
</span>

在关闭按钮的点击事件中，调用 `this.$alert` 方法的 `callback` 参数中指定的回调函数，用于关闭弹窗：

methods: {
  playAudio() {
    this.$alert('<audio src="audio.mp3" controls></audio>', '播放音频', {
      dangerouslyUseHTMLString: true,
      callback: action => {
        this.closeDialog();
      }
    });
  },
  closeDialog() {
    this.$alert().close();
  }
}

在上面的代码中，`closeDialog` 方法用于关闭弹窗，通过调用 `this.$alert().close()` 方法实现。