52 lines
1.1 KiB
Vue
52 lines
1.1 KiB
Vue
|
<script setup>
|
||
|
|
import { ref, onMounted, onBeforeUnmount } from "vue";
|
||
|
|
import Container from "@/components/Container.vue";
|
||
|
|
import audioManager, { audioFils } from "@/audioManager";
|
||
|
|
|
||
|
|
const loaded = ref({});
|
||
|
|
|
||
|
|
const playAudio = (key) => {
|
||
|
|
audioManager.play(key);
|
||
|
|
};
|
||
|
|
|
||
|
|
onMounted(() => {
|
||
|
|
const loadedAudioKeys = uni.getStorageSync("loadedAudioKeys") || {};
|
||
|
|
loaded.value = loadedAudioKeys;
|
||
|
|
|
||
|
|
uni.$on("audioLoaded", (key) => {
|
||
|
|
loaded.value[key] = true;
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
onBeforeUnmount(() => {
|
||
|
|
uni.$off("audioLoaded");
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<Container title="应聘测试">
|
||
|
|
<view class="container">
|
||
|
|
<view v-for="key in Object.keys(audioFils)" :key="key">
|
||
|
|
<text>{{ key }}</text>
|
||
|
|
<text v-if="!loaded[key]">未加载</text>
|
||
|
|
<button v-else hover-class="none" @click="playAudio(key)">播放</button>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</Container>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<style scoped>
|
||
|
|
.container {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
.container > view {
|
||
|
|
width: calc(100% - 50rpx);
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
padding: 25rpx;
|
||
|
|
}
|
||
|
|
</style>
|