Vue.js 防止默认链接点击但也捕获对象

我在学Vue.JS和我遇到了一点问题.我希望用户能够点击<a href="#"></a>标签e.preventDefault()，并抓取与链接相关的对象.以下是我的代码(请注意，{{前面有@，因为我使用的是Blade):

<a href="#"
   class="list-group-item"
   v-repeat="responder: responders"
   v-on="click: showResponder(responder)">
    <div class="media">
        <div class="media-left">
            <img src="" v-attr="src: responder.avatar" alt="" class="media-object"/>
        </div>
        <div class="media-body">
            <h4 class="media-heading">@{{ responder.first_name }} @{{ responder.last_name }}</h4>
            <p>
                <strong><i class="fa fa-phone"></i> Phone:</strong> @{{ responder.phone }}
            </p>
        </div>
    </div>
</a>

还有Javascript:

var vm = new Vue({
    el: "#responderContainer",
    data: {
        activeResponder: null,
        responders: []
    },
    methods: {
        showResponder: function(responder)
        {
            // Here is where I wish to prevent the 
            // link from actually firing its default action
            responder.preventDefault();
            this.activeResponder = responder;
        }
    }
});

这可以抓取responder个对象，但会触发链接——我需要能够同时抓取e.preventDefault()个对象和responder个对象.

谢谢