Combining vuejs v-repeat and php foreach loop?

I am currently using vue.js to echo out a bunch of items with its v-repeat functionality. Unfortunately I also need to run a php function inside the v-repeat loop that accepts an argument($beerId).

<div class="search-item" v-repeat="set: beers | chunk 4">
    <div class="row">
        <!-- Cycle through the data in "beer" -->
        <div v-repeat="beer: set">
            <div class="col-md-3">
                <h2>@{{{ beer.name }}}</h2>

                {{ auth()->user()->timesAddedBeer($beerId) }}
            </div><!-- /.col-md-3 -->
        </div><!-- v-repeat -->
    </div><!-- /.row -->
</div><!-- /.search-item -->

This block chunks up arrays into bits of 4 and displays 4 items per row with 12 items per page.

I need to be able to set the $beerid variable. I cannot assign it a beer.id javascript value because the javascript loads a fraction slower than the php and the php function executes before the javascript data has been loaded.

I do have access to a $beers array from php containing the same value but that would mean I would have to run a foreach loop somewhere to get those values out, and I already have a v-repeat loop. And I have no idea how to combine those.

Currently I feel like I am running out of options. This is also pretty hard to explain to outsiders and I have already simplified the example. If you need more info please just ask! I would be happy if somebody could help me out.