laravel - Laravel Sparkでvue.jsのデータをプリロードするにはどうすればよいですか?

Question

ドキュメントと例によると、私はうまく機能する完全に機能するコードを持っています:

Vue.component('admin-competitions-index', {
data: function() {
    return {
        competitions: []
    }
},

mounted() {
    this.$http.get('/api/admin/competitions')
        .then(response => {
            this.competitions = response.data;
    });
},

methods: {
    /**
     * Toggle whether a competition is published or not.
     */
    togglePublished(competition) {
        Spark.patch(`/api/admin/competitions/togglePublished/${competition.id}`, this.togglePublishedForm)
            .then(response => {
                competition.is_published = response;
            });
    }
}
});

ただし、このコードを変更して、ページの読み込み時に行われる余分なリクエストを保存したいと考えています。これが行われているLaravelやSparkのどこにも慣習はありません。私がする必要があるのはJS変数を設定することだけだと思いますが、どこでそうするのが適切なのかわかりません。

また、この種の非同期ロードに vue を使用するポイントが無効になることも理解していますが、それでもこれを学びたいと思います。@show の安静なリクエストに vue を使用すると、より便利になると思います。すべてを非同期でロードしたい場合でも、少なくともロードしたい競技 ID を vue に提供する必要があります。