2019-07-30から1日間の記事一覧

【Vue Cli】Google fontsを反映させたい

前回の記事の流れで、今度はGoogle fonts反映の方法もついでに記述しておきます。 まずは使いたいフォントを選び、@importとSpecify CSSのfont-familyを取得してきましょう。 あとはApp.vueに以下のように記述。 <template> <div id="app"> </div> </template> <script> //省略 </script> <style> @import "./css/styles.css";…

【Vue CLI】普通の外部CSSをcomponent全体に反映させたい

ルートコンポーネントであるApp.vueのStyleタグに読み込みたい外部CSSファイルを指定しましょう。ファイルパスは以下を参考にしてください。 src/css/styles.css src/App.vue <template> <div id="app"> </div> </template> <script> //省略 </script> <style> /* ファイルパスに従って@importntの後にファイルパスを書き込む </style>…

【Vue Router】APIデータを配列型でcomponentに渡して展開させたい

SPAでサイトを構築する際に、APIのデータが入ったファイルから同一componentへ、同一の項目を渡したいというシチュエーションでは以下のような方法が役に立ちます。 具体的なシチュエーション 商品ページをSPAで作る際に、商品名や値段などは各商品1つでいい…