Vue.js图片轮播组件
组件地址:
https://github.com/surmon-china/vue-awesome-swiper
npm install vue-awesome-swiper --save
<!-- 如果你后续需要找到当前实例化后的swiper对象以对其进行一些操作的话,可以自定义配置一个ref属性 -->
<swiper :options="swiperOption" ref="mySwiperA">
<!-- 幻灯内容 -->
<swiper-slide>I'm Slide 1</swiper-slide>
<swiper-slide>I'm Slide 2</swiper-slide>
<swiper-slide>I'm Slide 3</swiper-slide>
<swiper-slide>I'm Slide 4</swiper-slide>
<swiper-slide>I'm Slide 5</swiper-slide>
<swiper-slide>I'm Slide 6</swiper-slide>
<swiper-slide>I'm Slide 7</swiper-slide>
<!-- ... -->
<!-- 以下控件元素均为可选(使用具名slot来确定并应用一些操作控件元素) -->
<div class="swiper-pagination" slot="pagination"></div>
<div class="swiper-button-prev" slot="button-prev"></div>
<div class="swiper-button-next" slot="button-next"></div>
<div class="swiper-scrollbar" slot="scrollbar"></div>
</swiper>
import Vue from 'vue'
import { swiper, swiperSlide } from 'vue-awesome-swiper'
// use
export default {
components: {
swiper,
swiperSlide
}
}
参考:
相关推荐
Vue轮播 Vue 3的轮播组件。主要档案 dist/├── vue-carousel.js (UMD, default)├── vue-carousel.min.js (UMD, compressed)├── vue-carousel.esm.js (ECMAScript Module)└── vue-carousel.esm.min.js ...
一个简单的移动端卡片滑动轮播组件,适用于Vue2.x c-swipe 2.0 全新归来。重写了全部的代码,更靠谱的质量,更优秀的性能 English Document 安装 npm install c-swipe --save 使用 注册组件 // main.js // 引入 c-...
一般做移动端轮播图的时候,最常用的就是Swiper插件了,而vue.js也有一个轮播组件vue-awesome-swiper,用法跟swiper相似。接下来通过本文给大家详解讲解vue.js轮播组件vue-awesome-swiper实现轮播图实例代码,需要的...
主要为大家详细介绍了vue.js轮播图组件使用方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
敏捷 受启发的Vue.js轮播组件。 强大,响应Swift,触摸友好,具有Nuxt.js SSR支持,无需jQuery依赖项。即将推出更多演示和示例。 如果您喜欢该组件,请记住为其加注星标 :star: 。 如果您欣赏我的工作,也可以 :hot_...
vue原生js轮播图组件,轮播图我一开始是写成非插件形式实现的效果,后来才改成了封装成插件的形式。纯js实现,引入到项目中,直接调用组件即可使用,方便快捷
所以自己写了一个层叠式轮播组件;现在分享给大家; 主要技术栈是vue.js ;javascript;jquery;确定实现思路因工作繁忙,暂时不做梳理了;直接贴代码参考; 此组件是基于jquer封装,在vue项目中使用首先需要先安装...
欢迎进行现场演示拉取请求:)许可LGPL-V3功能适用于台式机和移动设备的响应式轮播组件。 除了Vue外,没有其他依赖关系具有GPU加速和过渡动画的高性能可通过基于CSS事件的API和通知进行样式设置安装npm install vue-...
vue 轮播图 带自动分页
va-carousel:一个基于vue的图片轮播组件
vue实现轮播图,实现滚动切换,无缝切换,自动切换,循环无回滚,暂停滚动等效果。适合初学者学习借鉴。对代码有疑问或者不懂的欢迎私信交流。
Sunburst提供了依赖D3.js的可重用的vue sunburst图表组件。 森伯斯特(Sunburst)是该库的主要组件,它基于数据道具显示森伯斯特图表,使用child属性作为层次结构,name属性作为命名属性,size属性作为圆弧大小。 ...
图片轮播是前端中经常需要实现的一个功能。最近学习Vue.js,就针对Swiper进行封装,实现一个简单的图片轮播组件。感兴趣的朋友跟随脚本之家小编一起学习吧
在Glide.js文档顶部的Vue Glide Vue组件https://antonreshetov.github.io/vue-glide安装NPM建议使用npm安装在Glide.js文档https:// antonreshetov之上的Vue Glide Vue组件。 github.io/vue-glide安装NPM建议使用npm...
Swiper(Swiper3) component for Vue.js(1.X ~ 2.X), support pc and mobile, SPA and SSR.
基于 Vue 的移动端的图片轮播组件. Why 之前一直在用 vue-awesome-swiper, 功能很齐全, 但是唯一的问题就是体积比较大. 我只是想要一个简单的图片轮播, 但是却要引入 100多k 大小的文件, 这样是不对的. 特点 ...
基于vue实现移动端轮播图,主要功能手指触摸滑动滚动、自动轮播、无缝滚动、循环无回滚等。图片切换有过渡效果。适合前端初学者学习。欢迎有疑问的小伙伴私聊提问哦。
vue-better-slider 为vue提供的轮播图组件