优化音频播放

feature/v-xuexi
wangdong 8 months ago
parent 7a0ea349da
commit eea3d35602
  1. 17
      pages/learningCenter/reciteContent.vue
  2. 27
      pages/learningCenter/reciteDetail.vue

@ -2,7 +2,7 @@
<BaseContainer class="recite-content flex"> <BaseContainer class="recite-content flex">
<NavBar title="内容列表" /> <NavBar title="内容列表" />
<view class="content-box"> <view class="content-box">
<view class="content-info"> <!-- <view class="content-info">
<view class="info-top flex"> <view class="info-top flex">
<image src="@/static/images/learning/icon.png" mode="aspectFill"></image> <image src="@/static/images/learning/icon.png" mode="aspectFill"></image>
{{ info.name }} {{ info.name }}
@ -15,7 +15,7 @@
<view>已练习{{ info.hasRecite }}/{{ info.count }}</view> <view>已练习{{ info.hasRecite }}/{{ info.count }}</view>
<view>试看剩余{{ info.surplus }}</view> <view>试看剩余{{ info.surplus }}</view>
</view> </view>
</view> </view> -->
<view class="list-content"> <view class="list-content">
<template v-if="info.contentList.length > 0"> <template v-if="info.contentList.length > 0">
<view v-for="(item, index) in info.contentList" :key="index" class="list-box"> <view v-for="(item, index) in info.contentList" :key="index" class="list-box">
@ -47,18 +47,7 @@
count: 1000, count: 1000,
hasRecite: 120, hasRecite: 120,
surplus: '00:12:12', surplus: '00:12:12',
contentList: [ contentList: []
{
title: '第一章节',
isLock: false,
list: ['goods', 'administration', 'goods', 'administration', 'goods', 'administration']
},
{
title: '第二章节',
isLock: true,
list: ['goods', 'administration', 'goods', 'administration', 'goods', 'administration']
}
]
}, },
list: [], list: [],
}; };

@ -11,12 +11,12 @@
]" @click="detailInfo.collect = !detailInfo.collect"></view> --> ]" @click="detailInfo.collect = !detailInfo.collect"></view> -->
</view> </view>
<view class="audio-box"> <view class="audio-box">
<view class="audio" :class="{ audioActive: activeAudio === 1 }" @click="activeAudio = 1;"> <view v-if="detailInfo.enAudio" class="audio" :class="{ audioActive: activeAudio === 1 }" @click="activeAudio = 1;">
<text>{{ detailInfo.enAudio }}</text> <text>{{ detailInfo.enAudio }}</text>
<image v-if="activeAudio !== 1" src="@/static/images/learning/audio.png" mode="aspectFill" @click="openAudio(1)"></image> <image v-if="activeAudio !== 1" src="@/static/images/learning/audio.png" mode="aspectFill" @click="openAudio(1)"></image>
<image v-else src="@/static/images/learning/audio_active.png" mode="aspectFill" @click="openAudio(1)"></image> <image v-else src="@/static/images/learning/audio_active.png" mode="aspectFill" @click="openAudio(1)"></image>
</view> </view>
<view class="audio" :class="{ audioActive: activeAudio === 2 }" @click="activeAudio = 2;"> <view v-if="detailInfo.uaAudio" class="audio" :class="{ audioActive: activeAudio === 2 }" @click="activeAudio = 2;">
<text>{{ detailInfo.uaAudio }}</text> <text>{{ detailInfo.uaAudio }}</text>
<image v-if="activeAudio !== 2" src="@/static/images/learning/audio.png" mode="aspectFill" @click="openAudio(0)"></image> <image v-if="activeAudio !== 2" src="@/static/images/learning/audio.png" mode="aspectFill" @click="openAudio(0)"></image>
<image v-else src="@/static/images/learning/audio_active.png" mode="aspectFill" @click="openAudio(0)"></image> <image v-else src="@/static/images/learning/audio_active.png" mode="aspectFill" @click="openAudio(0)"></image>
@ -90,6 +90,7 @@
name: '', name: '',
allList: [], allList: [],
chapterId: 0, chapterId: 0,
audioLoading: false,
}; };
}, },
onLoad({id, subjectId, name}) { onLoad({id, subjectId, name}) {
@ -119,13 +120,31 @@
} }
}, },
openAudio(type) { openAudio(type) {
console.log(`https://dict.youdao.com/dictvoice?type=${type}&audio=${this.detailInfo.name}`, this.audioLoading);
if (this.audioLoading) {
return false;
}
this.audioLoading = true;
const audio = uni.createInnerAudioContext(); const audio = uni.createInnerAudioContext();
audio.src = `http://dict.youdao.com/dictvoice?type=${type}&audio=${this.detailInfo.name}`; uni.downloadFile({
console.log(`http://dict.youdao.com/dictvoice?type=${type}&audio=${this.detailInfo.name}`); url: `https://dict.youdao.com/dictvoice?type=${type}&audio=${this.detailInfo.name}`,
success: (res) => {
if (res.statusCode === 200) {
console.log('下载成功');
audio.src = res.tempFilePath;
audio.play(); audio.play();
this.audioLoading = false;
}
}
})
// audio.src = `https://dict.youdao.com/dictvoice?type=${type}&audio=${this.detailInfo.name}`;
// audio.play();
audio.onError((res) => { audio.onError((res) => {
console.log(res); console.log(res);
}); });
// audio.onPlay((res) => {
// console.log(res);
// })
}, },
toNext() { toNext() {
const index = this.allList.findIndex(v => Number(v.id) === Number(this.id)); const index = this.allList.findIndex(v => Number(v.id) === Number(this.id));

Loading…
Cancel
Save