哈囉～大家好，今天也是講關於元件特性的部分。
每個元件都有自己的data、computed、methods，如同javascript變數可分為全域變數或區域變數，元件宣告也可分為全域元件或區域元件。
首先需要先透過Vue.createApp()建立一個新的實體：

const app = Vue.createApp({});
//元件註冊在 app 身上
app.component('example-component',{
    template:`<div>Vue 3</div>`,
    data(){},
    props:{},
    computed:{},
    methods{}
});
//新增一個根實體，並掛載於#app之上
app.mount('#app');

可透過app.component()將新建的元件註冊在app，這個根實體裡頭，除此外的其餘選項與過去幾乎一樣。

<div id="app">
  <h1>範例</h1>
  <example-component></example-component>
</div>

同樣改變寫法：

const app = Vue.createApp({});
app.use();
app.mixin();
app.component();
app.directive();
app.mount('#app');

主要是為了不把所有的東西全綁在Vue上，從原本整個Vue到根實體，即使頁面上同時宣告多個根實體也不會互相影響。
區域元件則在components裡面定義，若支援ES Module也可透過import將外部檔案引入子元件，

import exampleComponent from './components/example-component.js';

const app = Vue.createApp({
    components:{
        exampleComponent
    }
});
app.mount('#app');

區域元件和全域元件的部分，使用上沒有差別。

以上為今天的部分，感謝各位的閱讀，我們明天見～