How to get active item in owl-carousel

[Miroww]

Hello sir,

now I'm using Owl Carousel v2.3.4 for top menu. now I need to get active correct item in owl-carousel. I have tried to get it, but failed.

mushroom1

mushroom2

mushroom3

....

 <div class="menu-item item">
       <a class="text-white" data-href="/webshop/180/" data-id="180" data-index="22" id="cat_id_22">
             <span class="text-white h6 mb-0" style="padding:10px;">mushroom4</span>
      </a>
 </div>

var owl = $('.owl-carousel').owlCarousel({
dots: false,
items: 1,
loop: true,
autoWidth:true,
responsive: {
0:{
items:1,
},
600:{
items:1,
},
1000:{
items:3,
margin: 100,
}
}
});

     owl.on('changed.owl.carousel', function (event) {
          var value = event.property.value;
          var count = event.item.count;
         var index = (1 + ( value - Math.ceil( count / 2 ) ) % count || 0 ) || 1;
         var url = $("#cat_id_"+index).data('href');
         var category_id = $("#cat_id_"+index).data('id');
     });

if you have an experience, please let me know, thanks.