我將使用 Vuejs 的 flexbox 創(chuàng)建一個布局，如“header sidebar main-content sidebar footer”。我為布局的每個部分創(chuàng)建了單獨的 .vue 文件，我的意思是像 sidebar.vue 和 header.vue 等等......我將在 App.vue 文件中使用它們，例如：<template>  <div id="app">    <app-header ></app-header>    <app-sidebar></app-sidebar>    <app-content></app-content>    <app-sidebar></app-sidebar>    <app-footer></app-footer>  </div></template><script>import header from "./components/header";import sidebar from "./components/sidebar";import content from "./components/content";import footer from "./components/footer";export default {  components: {    "app-header": header,    "app-sidebar": sidebar,    "app-content": content,    "app-footer": footer  }};</script><style>body {  margin: 0;  padding: 0;}#app {  border: 3px solid red;  min-height: 100vh;  display: flex;  flex-wrap: wrap;  > * {    border: 1px solid black;  }}主要問題是我無法從 App.vue 文件中選擇這些自定義嵌套組件來設置它們的樣式。例如，我不能像 html 和 css 中的其他普通標簽一樣使用 app-header{} 來選擇它并在 App.vue 文件內(nèi)的樣式標簽中設置它的樣式。有沒有辦法解決它？注意：我知道我可以為這些嵌套組件中的每一個分配一個類，然后選擇它們與 css 類選擇器一起使用。