vue.js 用のカルーセル画像プラグインはありますか?-Vue.js-php.cn

vue.js 用のカルーセル画像プラグインはありますか?

青灯夜游

リリース： 2020-11-20 14:43:19

オリジナル

2536 人が閲覧しました

vue.js には、Swiper4 に基づいた Vue に適したカルーセルコンポーネントである vue-concise-slider などのカルーセル図プラグインがあり、サーバー側のレンダリングと単一ページアプリケーションをサポートしています。 -awesome-swiper 構成シンプルで、アダプティブ/フルスクリーンボタンページングをサポートし、モバイルと PC の両方と互換性があります。

vue.js 用のカルーセル画像プラグインはありますか?

vue.js カルーセルプラグイン vue-awesome-swiper

vue-awesome-swiper は Swiper4 に基づいています、Vue に適したカルーセルコンポーネントで、サーバー側のレンダリングと単一ページアプリケーションをサポートします。

vue-awesome-swiper は swiper に基づいています。さまざまなバージョンの vue-awesome-swiper をインストールすると、さまざまなスワイパーに対応するため、swiper のほとんどのプロパティを vue-awesome-swiper に適用するか、またはそれに応じて適用できます。 swiper vue-awesome-swiper プロパティを設定するためのドキュメント;

swiper 公式ドキュメント: https://www.swiper.com.cn/api/index2.html

インストール:

npm install vue-awesome-swiper --save

ログイン後にコピー

インポートの使用法:

// import 
import Vue from 'vue'
import VueAwesomeSwiper from 'vue-awesome-swiper'

// mount with global 
Vue.use(VueAwesomeSwiper)

// mount with component
import { swiper, swiperSlide } from 'vue-awesome-swiper'
 
export default {
  components: {
    swiper,
    swiperSlide
  }
}

ログイン後にコピー

ケース表示とサンプルコード:

https://surmon-china .github.io/vue-awesome-swiper/

vue.js 用のカルーセル画像プラグインはありますか?