読書メモ Vue.jsのコンポーネントシステム

Vue.jsのコンポーネントシステムについて、初歩的だけど大事そうなところメモ。本のコピペ 🙏

コンポーネントシステムとは

• Vue.jsにおけるコンポーネントとは、再利用可能なVueインスタンス
• Vue.jsのコンポーネントは、第一引数にコンポーネントの名前、第二引数にコンポーネントの内容、構成情報などのオプションを指定（Vue.component()APIを使う）
• 第二引数に入りそうなオプション。この中でtemplateとpropsがコンポーネント向けに使われる
• props は、 カスタムタグを親のコンポーネントに記述 するときに、 子のコンポーネントに対して外から受け取る変数を定義するオプション
• 親子関係があり、コンポーネントを利用する側が親、利用される側が子

書いてみた

• js側

• html側

• ブラウザ側

親コンポーネントと子コンポーネントの通信

親から子はなんなくわかった。子から親がよくわからない。親子関係についてもなんかよくわからなくなってきた？

• 親コンポーネントから子コンポーネントへデータを渡すには、propsオプションを使う
• propsはコンポーネントがインスタンス化したときにオブジェクトのプロパティとして利用

ログインフォームの機能を持ったコンポーネント