swiper怎么在vue3中使用
时间: 2024-04-22 08:17:22 浏览: 69
详解swiper在vue中的应用(以3.0为例)
在Vue3中使用Swiper需要先安装Swiper插件,可以通过以下命令进行安装:
```
npm install swiper
```
安装完成后,在Vue组件中引入Swiper并进行初始化即可使用。具体代码如下:
```vue
<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';
export default {
mounted() {
new Swiper('.swiper-container', {
pagination: {
el: '.swiper-pagination',
},
});
},
};
</script>
```
阅读全文