暂停方法停止时不停止的howler.js

Question

当我执行此代码时，pause方法将停止音频而不是暂停音频。我该如何解决？

<template>
  <v-layout row mt-5>
    <v-flex xs12 sm6 offset-sm3>
         <v-card style="text-align: center">
            <v-card-text>
                <v-btn outline icon class="teal--text" @click.native="playing ? pause() : play()">
                    <v-icon v-if="!playing">play_arrow</v-icon>
                    <v-icon v-else>pause</v-icon>
                 </v-btn>
            </v-card-text>
        </v-card>
    </v-flex>
  </v-layout>
</template>

<script>
import x from '@/assets/elbahr.mp3'
export default {
    data () {
        return {
            audio: undefined,
            playing: false
        }
    },
    methods: {
        play: function () {
            this.audio = new Howl({
                src: x,
                rate: 1.0,
                onend: function() {
                    this.playing = false
                }
            })
            this.audio.play()
            this.playing = true
        },
        pause: function () {
            this.audio.pause()
            this.playing = false
        }
    },    
}
</script>

<style scoped>