当前位置: 首页 > news >正文

VUE声音-报警-实现方式

1.先准备一个mp3文件包:(这个24小时生效如果失效可留言,看到就会增加时效)
获取mp3地址:

https://www.aliyundrive.com/t/uQ8zqjn9JKSfm7QlGOSr

2.代码内容
进入页面就会自动 播放mp3的内容信息了。

<template><div><audio id="audio" :src="require('/src/components/RuoYi/warning/预警.mp3')"></audio></div>
</template><script>
export default {data() {return {audioSrc: '/' // 音频文件的路径};},mounted() {// 播放音乐let oAudio = document.querySelector("#audio");oAudio.onended = function() {//播放完毕,重新循环播放oAudio.load();oAudio.play();};this.audioAutoPlay()},methods:{audioAutoPlay() {let audio = document.getElementById("audio");audio.play();document.removeEventListener("touchstart", this.audioAutoPlay);}}};
</script>
http://www.lryc.cn/news/96859.html

相关文章:

  • 【Coppeliasim C++】焊接机械臂仿真
  • 【LeetCode】94.二叉树的中序遍历
  • AWS IAM介绍
  • MySQL碎片清理
  • elasticsearch操作(API方式)
  • Vue2.0 使用 echarts
  • 企业微信,阿里钉钉告警群机器人
  • linux下的tomcat
  • Vue源码学习 - new Vue初始化都做了什么?
  • 新零售数字化商业模式如何建立?新零售数字化营销怎么做?
  • C++语法(26)--- 特殊类设计
  • YAML+PyYAML笔记 2 | YAML缩进、分离、注释简单使用
  • Array(20) 和 Array.apply(null, {length: 20})
  • Mind+积木编程控制小水泵给宠物喂水
  • 【Linux从入门到精通】进程的控制(进程替换)
  • rancher平台上强制删除pod服务操作
  • 【Docker】Docker的通信安全
  • c# 函数中可选参数太多,想设置最后一个参数,又不想修改前面默认参数
  • openvino资料(1)
  • 第71篇:某银行外网打点到内网核心区红队评估复盘
  • 网络安全 Day21-数据库知识
  • python测试开发面试常考题:装饰器
  • 语音同声翻译软件让你不再为语言障碍困扰
  • 又有一个手艺人震惊了B站用户
  • HDFS的设计目标和重要特性
  • 【JMeter】JMeter添加插件
  • 测牛学堂:车载测试面试总结之语音助手相关
  • Android开发之Fragment动态添加与管理
  • Python爬虫+数据可视化:分析唯品会商品数据
  • el-tree数据渲染超出省略