事件發生場景：在寫Vue的文件時，如果我們在頁面上存在多個相同的組件，然后每個組件中都會存在相同的網頁元素標簽，當我們在組件內部操作這些標簽，比如使用dom方法， document.querySelector() 用於搜索指定類名的HtmlElement，
因為dom操作是針對全局來搜索DOM樹的，因此如果有多個相同掛載的組件，那么你在當前組件下使用dom操作去查找這個類名HtmlElement，會發現也會查找到其他組件下的，此時想對該HtmlElement做一些dom操作，會伴隨一個問題，也就是會
同步改變另外相同組件下的這個HtmlElement。
解決辦法：<div class="test" ref="root">
const root=ref();//這里root就代表綁定的當前組件下的上的類名為test的 div了，
還有一種通過getcurrentInstance的方法來獲取當前組件下的實例，這里也可以使用，但是當打包為生產環境時如果用到里面的上下文ctx，就會報錯，此時的這個ctx是不存在的，因此在使用時應該謹慎使用ctx
順便在測試時引發一段關於vue的聲明周期的思考，vue3的setup函數即代表created周期，當在這里面打印root時，會發現undefined，這是因為這個在created時dom的元素沒有初始化出來，而當在mouted中打印時可以看到el對象，但是在created時
如果給ref中賦予null值，打印會出現null，這說明created時數據是初始化的，並且可以使用的。
總結一下就是created時數據完成初始化，dom實例沒有，此時進行http網絡請求是可以的，mouted時數據和dom實例都已經初始化好，一般數據請求還是放在created中，遵守先拿數據，然后出現dom，在dom中渲染數據的順序
此外，props、methods、data和computed的初始化都是在beforeCreated和created之間完成的。