怎么去使用这个代码，做个示范

如果你想在自己的项目中使用这个轮播组件，可以按照以下步骤进行：

1. 创建一个 Vue 组件，将上面的示例代码复制到该组件的对应位置中（template, script, style）。

2. 将图片资源文件（img1.jpg, img2.jpg, img3.jpg）放置到你的项目中，然后在代码中将图片路径修改为对应的路径。

3. 在需要使用轮播组件的页面中引入该组件并将其添加到页面中。

以下是一个简单的示例：

<template>
  <div class="carousel-wrapper">
    <carousel></carousel>
  </div>
</template>

<script>
import Carousel from './components/Carousel.vue';

export default {
  components: {
    Carousel,
  },
};
</script>

<style>
.carousel-wrapper {
  margin: 50px auto;
  width: 80%;
}
</style>

在这个示例中，我们创建了一个名为 `Carousel` 的组件，并在需要使用轮播组件的页面中将其引入并添加到页面中。注意，我们在组件名前添加了一个 `<` 符号，这是 Vue 单文件组件的语法。

最后，你需要根据自己的实际情况进行适当的修改，比如调整轮播的样式、添加自动轮播功能等。