今天是第二十五天，我想繼續簡單分享一下組件基礎

昨天有提及了全局註冊，想當然就會有局部註冊。

全局註冊的補充:

• 如果你全局註冊了一個組件，然後它並沒有被實際使用，它依舊會出現在打包後的JS文件中。沒有被使用的組件不會在生產打包時被自動移除(tree-shaking)
• 在較大規模的專案中會使各個組件的註冊關係變得不那麼明確。在父組件中使用子組件時，不太容易能定位子組件程式碼的執行。
• 使用過多的全局註冊可能會增加長期應用累積下來的維護難度。

局部註冊:

• 局部註冊的組件只能在它的父組件中註冊後才能掛載，並且只能在父組件中使用。它的優點是使組件之間的註冊關係 更明確。
• 它也對tree-shaking更加友好。

這裡是HTML的部分，跟昨天大同小異

<div id="app">
    <Button1></Button1>
        
    <Button1></Button1>
        
    <Button1></Button1>
</div>

這裡是JS的部分

<script>
    const Button1={
        data(){
            return{
                count:0
            }
        },
        template:`
        <button @click="count++">目前點了{{count}}次</button>
        `
    }
    
    const app = Vue.createApp({
        components:{
            Button1
        },
        template:`
        <div>
            <Button1></Button1>
        </div>
        `
    })
    
    const vm =app.mount("#app");
</script>

執行結果，我們可以看到只有產生一個按鈕，沒有跟全局註冊一樣

參考文件:
https://vuejs.org/guide/components/registration.html#local-registration

組件基礎(二)就分享到這邊，我們第二十六天見