Vue Carousel

Posted by muchag | 未分類 | 2018-11-22 (木) 20:53:28


公式:Vue Carousel Guide API Examples

【環境】
Vue Carousel: 0.16.0-rc2
Vue.js: 2.9.6
monaca CLI: 3.0.3
OS: Windows10 Pro 64bit
インストール

npm install -S vue-carousel
書式
グローバル

グローバルの場合、ではなくて
グローバルで下記のように記述。

main.js

import Vue from 'vue';
import VueCarousel from 'vue-carousel';

Vue.use(VueCarousel);
ローカル

ローカルの場合、ではなくて
利用する .vue ファイルに記述。

Hoge.vue

import { Carousel, Slide } from 'vue-carousel';
export default {
  ...
  components: {
    Carousel,
    Slide
  }
  ...
};
テンプレート

設定

carousel タグの属性として記述。
公式:API


;(セミコロン)を付けないと、「文字列だぞ!」と怒られる。

スタイル

/* ナビゲーションも含めたカルーセル全体 */
section.VueCarousel {
}

/* スライド全体 */
div.VueCarousel-wrapper {
}
div.VueCarousel-inner {
}

/* スライド個体 */
div.VueCarousel-slide {
}

現在のところ、div.VueCarousel-wrapper と div.VueCarousel-inner が
なぜ親子になっているのか不明。

未分類 | 2018-11-22 (木) 20:53:28 |

このブログについて

Posted by muchag | 未分類 | 2007-03-01 (木) 2:33:38

このブログは、爺による「備忘録」です。
言葉の使い方をはじめ、間違っていることも多々あるかもしれません。
あくまでも「備忘録」ですので、これのブログを見て「怒っちゃやーよ!」

自己責任にて閲覧してくださいね
未分類 | 2007-03-01 (木) 2:33:38 |