vue2中使用swiper轮播图

要在 Vue2 中使用 Swiper 轮播图，需要先安装 Swiper 库。可以通过以下命令进行安装：

npm install swiper --save

安装完成后，可以在 Vue 组件中引入 Swiper 库，示例代码如下：

<template>
  <div class="swiper-container">
    <div class="swiper-wrapper">
      <div class="swiper-slide">Slide 1</div>
      <div class="swiper-slide">Slide 2</div>
      <div class="swiper-slide">Slide 3</div>
    </div>
    <div class="swiper-pagination"></div>
  </div>
</template>

<script>
import Swiper from 'swiper';
import 'swiper/css/swiper.css';

export default {
  mounted() {
    new Swiper('.swiper-container', {
      pagination: {
        el: '.swiper-pagination',
      },
    });
  },
};
</script>

在上面的代码中，首先在 `template` 标签中定义了一个 `swiper-container`，其中包含了三个 `swiper-slide`，分别显示为 `Slide 1`、`Slide 2` 和 `Slide 3`。在 `mounted` 钩子函数中，通过 `import` 引入了 Swiper 库，并通过 `new Swiper` 创建了一个 Swiper 实例，其中传递了一个配置对象，用于设置轮播图的参数。在这里我们设置了 `pagination` 参数，用于显示轮播图的分页器。

最后，为了让样式生效，还需要在 `style` 标签中引入 Swiper 的 CSS 样式，示例代码如下：

<style>
@import '~swiper/css/swiper.css';
</style>

以上就是在 Vue2 中使用 Swiper 轮播图的基本步骤。