master
2022-02-14 1684d66eaf39f77980b987359f413d2ff5714940
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<template>
    <div class="icon-voice">
        <icon-svg :name="`voice${index}`" />
    </div>
</template>
 
<script lang="ts" setup>
import { defineProps, ref, watch } from "vue";
 
let timer: any = null;
 
const index = ref<any>("");
 
const props = defineProps({
    play: Boolean
});
 
watch(
    () => props.play,
    (val: boolean) => {
        clearInterval(timer);
 
        if (val) {
            index.value = 1;
 
            timer = setInterval(() => {
                if (index.value == 1) {
                    index.value = "";
                } else {
                    index.value += 1;
                }
            }, 500);
        } else {
            index.value = "";
        }
    }
);
</script>
 
<style lang="scss" scoped>
.icon-voice {
    display: inline-block;
    margin-right: 5px;
}
</style>