Vuetify Nuxt.js : how to add Routing link in Carousels icon

js and Vuetifiy i want to add Routing link in Carousels icon. if i press icon it should open Routing link. i tried but its not responding my link its not working below code i tried but note worked

          {
            images: [
              { src: "/image1.png", caption: "Shopping-Page", to:"/ShoppingPage"},
              { src: "/image2.png", caption: "Cart-Page", to:"/CartPage" },
              { src: "/image3.png", caption: "main-Page", to:"/mainPage" }
              
            ]
          },

My router links this below router links i want to add

 to="/ShoppingPage" 

 to="/CartPage" 

 to="/mainPage"

my page view locking like this

my code

<template>
  <v-layout style="width: auto;" class="ma-auto">
    <v-carousel cycle light height="309" hide-delimiter-background show-arrows-on-hover>
      <v-carousel-item v-for="(slide, i) in slides" :key="i">
        <v-row>
          <v-col cols="3" v-for="(images, j) in slide.images" :key="j">
            <div class="d-flex flex-column justify-center align-center">
              <v-img :src="images.src" width="30"/>
              <span class="mx-auto text-center caption"></span>
            </div>
          </v-col>
        </v-row>
      </v-carousel-item>
    </v-carousel>
  </v-layout>
</template>

<script>
export default {
  name: "playground",
  data: () => ({
    slides: [
      {
        images: [
          { src: "/image1.png", caption: "Shopping-Page"},
          { src: "/image2.png", caption: "Cart-Page" },
          { src: "/image3.png", caption: "main-Page" }
          
        ]
      },

via Chebli Mohamed