[Bug Report] 布局容器中當<el-header>以及<el-footer>兩者同時基於複用代碼而封裝成js時，在布局容器<el-container>中同時以外部引入的方式導入組件時會造成排列成為水平的bug問題

### Element UI version
2.15.9

### OS/Browsers version
W10/Chrome 114.0.5735.110

### Vue version
2.6.14

### Reproduction Link
https://github.com/arcoshin/JSDTN2303-Web/blob/master/baker_practice_1/src/main/resources/static/index.html

### Steps to reproduce
在38行以及199行中
布局容器中當以及兩標籤之間的內容同時基於複用代碼需求而封裝成js時，在布局容器中同時以外部引入的方式導入js組件時會造成排列成為水平的bug問題，此時雖然於標籤中手動添加direction="vertical"可以暫時解決問題，但讀取完成時對於本身的"高度樣式"會無法正常取用(只有高度，其餘背景、字體顏色皆可正常套用"，此時必須將此高度設計在js檔案的標籤中才能生效

### What is Expected?
預期應該是當我們將及兩標籤中的整段代碼封裝為(假設名稱)my-header.js、my-footer.js時
如果以外部引入js的方式時布局容器應該是要能自動識別js中的標籤，因為撇除這個主標籤及()可以識別不談，js中主標籤中的內容依樣包含許多標籤卻是可以自動識別的，因此我認為這屬於一個bug

即便上述問題可以於代碼中如下保留子元素標籤來解決布局容器識別標籤後自動垂直排列的問題

.
.
.

但仍會產生我所敘述的第二個問題
如果對於標籤本身有樣式的需求
使用內連el.footer{
height: 280px;
background-color: #2f3234;
padding: 50px 0;
}此時除了高度以外所有樣式皆會生效

但如果使用內部

此時所有樣式皆可以生效
若是使用外部則效果同內部，高度不會生效

測試結果高度必須在js檔案中的
...
才能生效

這部分預計樣式應該不可能存在篩選性生效

### What is actually happening?
測試結果對於識別子元素標籤時無法彆別js中的主要標籤，但卻可以識別其他標籤，應該是一個bug

Start with the linked reproduction in src/main/resources/static/index.html, especially lines 38 and 199, using Element UI 2.15.9 and Vue 2.6.14. Compare the external JavaScript wrappers for el-header and el-footer with direct child components, then verify container direction and footer height behavior. Done means the reproduction renders vertically and applies the reported footer styles consistently.

Written by the indexing model from the issue text.