<aside> 🌿 多分ほとんど使わない

</aside>

【Vue.js2&Vue.js3対応】基礎から【Vuetify】を使った応用まで！ 超初心者から最短距離でレベルアップ @udemy 世界のアオキ セクション4-50

【特徴（お約束）】

• インスタンス化の前に書く
• template内はバッククォート（````）で囲う
  • ディレクティブも記述可能
• 単一ルートが必須（divタグなど）

▼書き方

const { createApp } = Vue;
const app = createApp({});

app.component('COMPONENT_NAME', {
		// templateの他に、今まで書いてきたdataやmethodsも記述可能
		OBJECT_KEY: OBJECT_VALUE,
		// templateはグローバルコンポーネント特有なので、下記のコード例に記述しておく    
})
.mount('#app');

▼コード例

// html
<div id="app">
  <my-component />
</div>

// js
<script>
  const { createApp } = Vue;
	const app = createApp({});

  app.component("my-component", {
    template: `
      <div>
        <p>あああ
          <br>
          いいい
        </p>
        <div v-show="isShow">表示</div>
      </div>
      `,
    data() {
      return {
        isShow: false,
      };
    },
  })
  .mount('#app');
</script>