🎈 この記事はWP専用です
https://wp.me/pc9NHC-DX
前置き
componentとは
使いまわしができる、
再利用ができるものです🌟
シンプルなボタンでも
CSSが長くなったりして
まいかい書くのは面倒ですよね…😔
それを解決してくれるのが
componentです🌟
作り方、表示のさせ方を解説していきます✍️
目次
前置き
componentの種類と使用箇所
基本コード
Step1: 使い回すコンポーネントを作る
Step2: コンポーネントをインポートする
自動でインポートする
まとめ
componentの種類と使用箇所
種類
まずは種類を把握しましょう。
おおまかに全部で3つあります💡
今回は1の自作のコンポーネント
について解説していきます🍎
前置きに書いたボタンのような場合は
自作のコンポーネントに該当します🙋♀️
- <好きに命名した名前 /> =自作のコンポーネント importが必要！
- layouts内でのみ使用
- ネストされたルート内で使用
nuxtとnuxt-childについては
別記事でご紹介します🌟
使用箇所
componentsが使える場所
(インポートできる場所)は
ページを構成する部分です！
・layout
・他のコンポーネント
・pageコンポーネント
自作のコンポーネントの場合は
この中のどれでも使用可能です🤗
基本コード
基本コードがこちら。
あとは使いまわしたい物に
作り替えていきましょう👍✨
🎈 続きはWPでご覧ください👀
https://wp.me/pc9NHC-DX