Pass vuejs ID to a data-url

I have v-for="product in products"
How i can pass product.id to a data-url? I try:

<li class="list-group-item" v-for="product in products">
@
<input
type="checkbox" :id="product.id" :value="product.id" v-model="product.checked"
class="toggle-product pull-right"
data-url="/accounts/ /albums//images//settings/@/toggle">

or

data-url="

not work.

        $(function () {
            // enable/disable products on sidebar
            $(".toggle-product").on('click', function () {
                var checked = $(this).is(':checked');
                var $status = $(this).parents(".list-group-item");
                $status.addClass('list-group-item-warning');
                $.post($(this).data('url'), {
                    'enabled': checked ? 1 : 0,
                    '_token': ""
                }, function (response) {
                    $status.removeClass('list-group-item-warning');
                }.bind(this))
            });
        });
        
         new Vue({
            el: '#products',

            data: {
                products: [
                    @foreach($validProducts as $p)
                    { label: '', id: '', @if(!isset($restrictedProductIds[$p->id])) checked: true @endif},
                    @endforeach
                ]
            },

            computed: {
                checked: function (){
                    return this.products.filter(function (l) {
                        return l.checked
                    }).map(function (l){
                        return l})
                }
            },          
         });    

Can you help me, thanks.

I know there are two side, server side and client side, but mybe have possible to pass that id ?

via Arturs Jerjomins