https://github.com/jiangfengming/vue-carousel

A Vue carousel component
https://github.com/jiangfengming/vue-carousel

Last synced: about 2 months ago
JSON representation

A Vue carousel component

• Host: GitHub
• URL: https://github.com/jiangfengming/vue-carousel
• Owner: jiangfengming
• License: mit
• Created: 2020-01-19T09:50:29.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2020-08-11T10:27:29.000Z (almost 4 years ago)
• Last Synced: 2024-03-30T20:42:10.088Z (2 months ago)
• Language: Vue
• Homepage:
• Size: 792 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Lists

• awesome-vue - @jfm/vue-carousel - A Vue carousel component. (Components & Libraries / UI Components)
• awesome-vue - @jfm/vue-carousel - A Vue carousel component. (Components & Libraries / UI Components)
• awesome-vue - @jfm/vue-carousel - A Vue carousel component. (Components & Libraries / UI Components)
• awesome-vue - @jfm/vue-carousel - A Vue carousel component. (Components & Libraries / UI Components)
• awesome-vue - @jfm/vue-carousel - A Vue carousel component. (Components & Libraries / UI Components)
• awesome-vue - @jfm/vue-carousel - A Vue carousel component. (Components & Libraries / UI Components)
• awesome-vue - @jfm/vue-carousel - A Vue carousel component. (Components & Libraries / UI Components)
• awesome-vue - @jfm/vue-carousel - A Vue carousel component. (Components & Libraries / UI Components)
• awesome-vue - @jfm/vue-carousel - A Vue carousel component. (Components & Libraries / UI Components)
• awesome-vue - @jfm/vue-carousel - A Vue carousel component. (Components & Libraries / UI Components)

README

        
# @jfm/vue-carousel

A Vue carousel component.

## Demo

[https://jiangfengming.github.io/vue-carousel/demo/](https://jiangfengming.github.io/vue-carousel/demo/)

[Source code](https://github.com/jiangfengming/vue-carousel/blob/master/demo-src/App.vue)

## Install

```

npm i @jfm/vue-carousel

```

## Usage

```vue

  

    

      slide 1

      slide 2

      slide 3

    

    backward

    forward

  

import { Carousel, Slide } from '@jfm/vue-carousel'

export default {

  components: { Carousel, Slide },

  data: () => ({

    currentPage: 1,

    totalPages: 1

  })

}

.carousel {

  width: 400px;

  height: 300px;

}

.slide {

  width: 100%;

  height: 100%;

}

```

## \ options

* `current-page.sync`: `Number`. Current page number.

* `total-page.sync`: `Number`. Total page count.

* `autoplay`: `Boolean` or `Number` (milliseconds). If `true`, it defaults to 3000.

* `direction`: `String`. `horizontal`, or `vertical`.

  

## License

[MIT](LICENSE)