vue2 中使用音频

vue2 中使用音频

  • template 页面 写入 audio 标签
<template>
	<div>
        <audio ref="moreAudio" :src="moreAudioSrc"></audio>
        <audio ref="noAudio" :src="noAudioSrc"></audio>
    </div>
</template>
  • script 内写入音频路径
<script>
export default {
    data() {
        return {
            moreAudioSrc:'./audio/more.wav',
            noAudioSrc:'./audio/no.wav'
        }
    }
}
</script>

通常将音频文件放在 public 文件下

在这里插入图片描述

  • 在方法里面使用
playFn(){
	if(!data) {
		this.$refs.noAudio.play()
	} else {
		this.$refs.moreAudio.play()
	}
}

相关推荐

  1. Vue2Vuex使用mapMutations和mapActions

    2024-03-24 15:46:05       31 阅读
  2. Js使用ffmpeg在视频合成音频背景音乐

    2024-03-24 15:46:05       46 阅读

最近更新

  1. TCP协议是安全的吗?

    2024-03-24 15:46:05       16 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-03-24 15:46:05       16 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-03-24 15:46:05       15 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-03-24 15:46:05       18 阅读

热门阅读

  1. 数据仓库——大维度问题

    2024-03-24 15:46:05       22 阅读
  2. 蓝桥杯day9刷题日记

    2024-03-24 15:46:05       22 阅读
  3. 支持向量和非支持向量

    2024-03-24 15:46:05       19 阅读
  4. hive 3.1.3 搭建

    2024-03-24 15:46:05       15 阅读
  5. python中的协程使用

    2024-03-24 15:46:05       18 阅读