real47LEBJ 2022-05-16 18:01 采纳率: 95.7%
浏览 277
已结题

Vue如何根据条件播放本地MP3文件

以下是对话框JS,对话框默认隐藏,目的是根据条件弹出对话框的同时播放MP3音频


 <div style="position: absolute">
        <el-dialog class="el-card__body" title="AAAA" :visible.sync="form.t1.dialogFormVisible"
                   @closed="handleClose1">
        </el-dialog>
      </div>

以下是对话框绑定的方法,会根据条件改变form.t1.dialogFormVisible为true从而显示对话框。
目的是在if判断条件成立后触发播放音频

watch: {
    list1: function (value) {
         for (const a of value) {
              if (a.alarmLevel == 0) {
          this.form.t1.dialogFormVisible = true
}}}}

下图是音频和本页面的结构

img

  • 写回答

2条回答 默认 最新

  • web修理工 2022-05-17 12:13
    关注

    判断条件已经知道 只要把 判断条件和你的音频对应即可实现

    import audio form './xx.MP3'
    data(){
     return {
     audio:audio
     }
    }
    <audio ref='audio' :src='audio '></audio>
    
    // 通过 this.$refs.audio.paly() 播放
    // 通过 this.$refs.audio.pause() 暂停
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

问题事件

  • 系统已结题 5月25日
  • 已采纳回答 5月17日
  • 创建了问题 5月16日

悬赏问题

  • ¥20 R语言单细胞测序 对seurat对象进行标准化时出现问题
  • ¥15 Anaconda navigator updateor一直更新
  • ¥15 请问如何在matlab里使用raven工具?
  • ¥100 关于ios手游充值到一定金额,再点充值提示公众号的问题。
  • ¥15 求一个stm32串口控制程序
  • ¥20 Windows 驱动开发版本疑问相关
  • ¥15 MAC 未能打开磁盘映像
  • ¥15 fastcap使用,二维导体输入问题
  • ¥15 hosts修改后不能访问
  • ¥15 关于化学反应速率C++编译问题/FLUENT