Vue.jsで削除前の確認ダイアログを作りたい

laravelのbladeファイルで作っていた削除ボタンを
Vue.jsに移植対応中

〜
<form method="POST" action="{{ route('deleteWord', $searchWord->id) }}">
                    <div class="p-buttonbox">
                        <button class="c-button"
                                onclick='return confirm("削除しますか？");'>{{__('Delete')}}</button>

                    </div>
                </form>
〜

削除ボタンを押すと「削除しますか？」の確認のダイアログが
出てからlaravelの削除処理へアクセスするこの挙動を維持したい
ボタン部分は

                    <button class="c-button" v-on:click="deleteWord(searchWord.id)">削除する</button>

に変更して
Javascriptの部分で確認ダイアログを実装し
API化したlaravelにidを送る

<script>
import axios from 'axios';

export default {
    data: function () {
        return {
        }
    },
    methods: {
        deleteWord(id) {
            if (confirm("削除しますか?")) {
                axios.post('/api/deleteWord/' + id)
                    .then((res) => {
                        this.$router.push({name: 'home'});
                    });
            }
        },
    },
}
</script>