如何使用setTimeout删除消息横幅+ VueJs 2？

Question

我有一个vueJs 过渡，一旦点击一个按钮，就会将消息横幅带入视图。如果用户没有与UNDO按钮交互，我想使用setTimeout在一定时间后删除横幅。

我的消息横幅代码

HTML

<div v-for="card in cards">
    <credit-card v-if="!card.creditCardRemoved" :card="card" @remove="removeCard(card)"></credit-card>

    <transition name="fade" @leave="removeMessage">
        <div class="o-message-banner" v-if="card.creditCardRemoved == true">
            <div class="pull-left"> Your <strong> {{ card.name }} </strong> credit/cheque card has been removed </div> 
                <a class="o-undo" @click="undoDelete"> Undo </a>
            </div>
    </transition>


</div>

JS

data: {
    return {
        cards: [{
                name: 'visa',
                creditCardRemoved: false
            }, {
            name: 'mastercard',
            creditCardRemoved: false
        }],
        card: '',
        message: false
    }
},

methods: {
    undoDelete: function(card) {
        card.creditCardRemoved = false;
    },
    removeCard: function(card) {
        card.creditCardRemoved = true;
        this.removeMessage();
    },
    removeMessage: function() {
        setTimeout(function() {
            this.message = !this.message;
        }, 5000);
    }
}