【vue-awesome-swiper】サムネイル付きスライダーの実装 - Qiita

はじめに swiperを用いたスライダーの実装の記事はたくさんあったが、 サムネイル画像もスライダーにする実装ばかりでサムネイル画像を固定画像とするものが少なかったので 残しておきます。 環境 MacOS yarn 1.22.17 node v14.17.1 vue 2.6.14 vue-awesome-swiper 4.1.1 完成品 以下のようなサムネイル付きスライダーを作成します！ 全体コード <template> <div class="room-swiper"> <Swiper ref="swiperRef" class="top" :options="swiperOption"> <SwiperSlide v-for="(slider, index) in sliderContents" :key="index" class="slide" > <img class="imag