Vueの勉強用ページ
→をクリックすると目次が出てくる
- transitionタグで表示をオン/オフに切り替える
- 目次を囲っているdivタグにv-if="flg"を設定
- ボタンを押すと、buttonの属性に設定してある v-on:click="doAction"が発動
- doActionはthis.flg=!this.flgを実行し、trueとfalseを切り替える
←の中でやっていること:
- 「1~14」という名前のディレクトリを作成(中にはそれぞれindex.htmlファイルを格納)
- data関数の中で配列pages: ['その1', 'その2', 'その3',…]を定義
- ulの属性にv-forを使用 ul v-for="(page, id) in pages"
- 子要素のaタグの属性にv-bindを使用 a :href="id + 1 + '/index.html'"