2 回答

TA貢獻(xiàn)1851條經(jīng)驗(yàn) 獲得超5個(gè)贊
將導(dǎo)航欄和主要內(nèi)容包裝在<v-row>:
<template>
<div id="app">
<v-app>
<v-row>
<navbar/>
<v-main>
<v-container class="main-container">
<router-view/>
</v-container>
</v-main>
</v-row>
</v-app>
</div>
</template>
默認(rèn)情況下,v-app有一個(gè)帶有flex-direction: columnCSS 的內(nèi)部包裝器,這意味著它的子元素是垂直放置的。通過(guò)將這兩個(gè)子元素包裝在 a 中v-row,您可以將它們放置在帶有 的包裝元素中flex-direction: row。

TA貢獻(xiàn)1826條經(jīng)驗(yàn) 獲得超6個(gè)贊
我猜你誤解了這些概念。您正在將 a 包裝在組件v-navigation-drawer
內(nèi)navbar
。
在Vuetify?v-navigation-drawer
中,有一個(gè)用于構(gòu)建側(cè)邊欄的組件,這就是您的組件處于垂直方向的原因。
編輯1
app
您可以使用組件內(nèi)的選項(xiàng)配置應(yīng)用程序側(cè)邊欄或應(yīng)用程序?qū)Ш綑?,如下所示?/p>
? <v-navigation-drawer
? ? app
? >
? ...
? </v-navigation-drawer>
就像官方文檔中一樣。如果你這樣做,該組件將正常工作,并且你的內(nèi)容將不會(huì)被下推。
添加回答
舉報(bào)