|
|
@@ -1,13 +1,6 @@
|
|
|
<template>
|
|
|
- <div
|
|
|
- class="images"
|
|
|
- >
|
|
|
- <audio
|
|
|
- id="audioTag"
|
|
|
- class="noshow"
|
|
|
- autoplay
|
|
|
- :src="audioSrc"
|
|
|
- ></audio>
|
|
|
+ <div class="images">
|
|
|
+ <audio id="audioTag" class="noshow" autoplay :src="audioSrc"></audio>
|
|
|
<div class="audiocon">
|
|
|
<div class="adcon">
|
|
|
<div class="bar">
|
|
|
@@ -34,11 +27,11 @@
|
|
|
|
|
|
<script>
|
|
|
export default {
|
|
|
- name:'Audio',
|
|
|
+ name: "Audio",
|
|
|
props: {
|
|
|
- audioSrc:{
|
|
|
- type:String
|
|
|
- }
|
|
|
+ audioSrc: {
|
|
|
+ type: String,
|
|
|
+ },
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
@@ -96,37 +89,43 @@ export default {
|
|
|
this.$nextTick(() => {
|
|
|
this._audio = $("#audioTag")[0];
|
|
|
$("#audioTag").on("loadedmetadata", (e) => {
|
|
|
- this.time = this.isMobile?'00:00':this.transTime(e.currentTarget.duration);
|
|
|
+ this.time = this.isMobile
|
|
|
+ ? "00:00"
|
|
|
+ : this.transTime(e.currentTarget.duration);
|
|
|
this.allTime = this.transTime(e.currentTarget.duration);
|
|
|
- this._audio.play()
|
|
|
+ this._audio.play();
|
|
|
this.isPlay = true;
|
|
|
});
|
|
|
|
|
|
- document.addEventListener("WeixinJSBridgeReady", function () {
|
|
|
- this._audio.play()
|
|
|
- }, false);
|
|
|
+ document.addEventListener(
|
|
|
+ "WeixinJSBridgeReady",
|
|
|
+ function () {
|
|
|
+ this._audio.play();
|
|
|
+ },
|
|
|
+ false
|
|
|
+ );
|
|
|
|
|
|
$("#audioTag").on("timeupdate", () => {
|
|
|
this.updateProgress();
|
|
|
});
|
|
|
|
|
|
- $("#audioTag").on("timeupdate", () => {
|
|
|
+ $("#audioTag").on("timeupdate", () => {
|
|
|
this.updateProgress();
|
|
|
});
|
|
|
|
|
|
$("#audioTag").on("ended", () => {
|
|
|
+ // console.log('音乐播放完毕');
|
|
|
this.audioEnded();
|
|
|
});
|
|
|
});
|
|
|
},
|
|
|
activated() {
|
|
|
- this.isPlay=this.isMobile
|
|
|
- },
|
|
|
+ this.isPlay = this.isMobile;
|
|
|
+ },
|
|
|
};
|
|
|
</script>
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
-
|
|
|
.images {
|
|
|
overflow: hidden;
|
|
|
border-radius: 10px;
|