element ui走马灯点击图片转换

要实现点击图片切换走马灯的功能，可以利用 `@click.native` 事件来监听图片的点击事件，然后根据点击的图片的索引值来切换当前显示的图片。具体实现步骤如下：

1. 在 `el-carousel` 标签上添加 `ref` 属性，用于获取走马灯组件的实例。

<el-carousel ref="carousel">
  <el-carousel-item v-for="(item, index) in items" :key="index">
    <img :src="item.src" @click.native="handleImgClick(index)">
  </el-carousel-item>
</el-carousel>

2. 在 `methods` 中定义 `handleImgClick` 方法，该方法接收一个索引值作为参数，通过 `this.$refs.carousel.setActiveItem(index)` 方法将当前显示的图片切换为点击的图片。

methods: {
  handleImgClick(index) {
    this.$refs.carousel.setActiveItem(index);
  }
}

完整示例代码如下：

<template>
  <div class="demo-carousel">
    <el-carousel ref="carousel">
      <el-carousel-item v-for="(item, index) in items" :key="index">
        <img :src="item.src" @click.native="handleImgClick(index)">
      </el-carousel-item>
    </el-carousel>
  </div>
</template>

<script>
export default {
  data() {
    return {
      items: [
        { src: 'https://picsum.photos/800/400/?image=1018' },
        { src: 'https://picsum.photos/800/400/?image=1015' },
        { src: 'https://picsum.photos/800/400/?image=1016' },
        { src: 'https://picsum.photos/800/400/?image=1019' },
      ]
    }
  },
  methods: {
    handleImgClick(index) {
      this.$refs.carousel.setActiveItem(index);
    }
  }
}
</script>