v-for on multi component generate wrong data - solved!

I write a <Product> component and each component has own data, but on pagination, same indexed " data" i wrong.

Product:

<script>
    export default {
        name: "Product",
        props: ['product'],
        data(){
            return{
                count: '',
            }
        },       
    computed: {
            InventoryCount(){
                if (! this.product.latest_inventory){
                    return {};
                }
                return this.product.latest_inventory.count;
            }
        },
    }
</script>

And i use this component In this way:

<div v-for="product in products" class="col-md-12 col-xl-6">
    <product :product="product" inline-template>
        <div class="product-thumbnail">
            <div class="product-thumbnail__image">
                <img :src="'/' + product.image" class="img-fluid">
            </div>
            <div class="product-thumbnail__title">
                <a :href="'/admin/product/' + product.id + '/edit'"><span>@{{ product.title }}</span></a>
            </div>
            <div class="product-thumbnail__controller">
                <div v-if="product.latest_inventory">
                    <div>
                        <select class="select-count" v-model="count" v-select2>
                            <option v-for="item in InventoryCount" :value="item">@{{ item | convertToFa }}</option>
                        </select>
                    </div>                   
                </div>              
            </div>
        </div>
    </each-product>

</div>

‍‍‍‍