如何在 SPA Vue.js 中包含常用元件 Header 和 Footer
P粉821274260
P粉821274260 2023-08-28 18:16:20
0
1
617
<p>我正在 vuejs 中建立一個專案 spa/我已經建立了常用元件頁首和頁腳,我想將其包含在主 App.vue 中。 </p> <p>我在下面分享我的程式碼結構:</p> <ol start="2"> <li>我正在分享我的檔案 App.vue:</li> </ol> <p> <pre class="brush:html;toolbar:false;"><template> <header></header> </template> <script> import Header from './components/Header.vue' // import Footer from 'components/Footer.vue' export default { name: 'App', components: { Header, // Footer } } </script></pre> </p> <ol start="3"> <li>在 Vue.js 的頁面中沒有出現任何想法如何將頁首和頁腳包含在一起以在 spa vuejs 中顯示良好。 這種方式哪裡不對呢? </li> </ol></p>
P粉821274260
P粉821274260

全部回覆(1)
P粉488464731

headerfooter 是原生html 元素,您應該使用不常見的名稱來命名元件,例如將它們命名為AppHeader AppFooter 並像這樣使用它們:

<template>
  <AppHeader />
  <!-- other content-->
  <AppFooter /> 
</template>
<script>
  import {AppHeader} from './components/AppHeader.vue'
  import {AppFooter} from './components/AppFooter.vue'
  export default {
   name:'App',
   components:{ AppHeader, AppFooter}
 
  }
</script>
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板