Vue.js
new Vue( {/*オプションを設定*/})
機能:
SFC: Single File Component
template, script, (scopedにできる)stypeの3つを single fileに。
$props, $options, $mount, $el, $destroy, $watch, $data
$ref
Domを触りに行く時に使う.? Componentそのものもある。
$refs is like the document.querySelector(‘.el’) in vanilla JS $(‘.el’) in jQuery
未だよく分かってない。
component
コンポーネントは名前付きの再利用可能な Vue インスタンス
ルート Vue インスタンス内でカスタム要素として使用することができます。
SFC(Single File Component) Componentで1つのファイル(template, script, style)をまとめて書くのが Vue.jsの特徴
ルートVueインスタンスの下に、いくつかのコンポーネントが集まって、htmlがレンダリングされるイメージでよいか。
部品
lifecycle
Componentが、
(インスタンスとして)Created,
(仮想DOMに)Mounted,
(dataプロパティの値(リアクティブに反応する)が) Update
(部品としてのインスタンスが) Destroy
この4つイベントの before, afterで イベントフックがある
reactive
slot
タグ自体を変数として渡すときに、渡されたタグが入るところ。
Vue.component('alert-box', {template: .....<slot></slot>.....})
比較:
組み合わせ
https://gyazo.com/5de7af21d4c2de951720c006f84b98fc