Vue.js 如何更改Quasar应用程序的布局并将左抽屉向右放置?
我对类星体的布局感到迷茫,虽然我已经阅读了它的文档,但我不理解它 架子工给了我以下代码。但这使得抽屉在左边。我怎样才能把它放在右边Vue.js 如何更改Quasar应用程序的布局并将左抽屉向右放置?,vue.js,quasar-framework,quasar,Vue.js,Quasar Framework,Quasar,我对类星体的布局感到迷茫,虽然我已经阅读了它的文档,但我不理解它 架子工给了我以下代码。但这使得抽屉在左边。我怎样才能把它放在右边 <template> <q-layout view="lHh Lpr lFf"> <q-header elevated> <q-toolbar> <q-btn flat dense round
<template>
<q-layout view="lHh Lpr lFf">
<q-header elevated>
<q-toolbar>
<q-btn
flat
dense
round
icon="menu"
aria-label="Menu"
@click="leftDrawerOpen = !leftDrawerOpen"
/>
<q-toolbar-title>
Quasar App
</q-toolbar-title>
<div>Quasar v{{ $q.version }}</div>
</q-toolbar>
</q-header>
<q-drawer
v-model="leftDrawerOpen"
show-if-above
bordered
content-class="bg-grey-1"
>
<q-list>
<q-item-label
header
class="text-grey-8"
>
Essential Links
</q-item-label>
<EssentialLink
v-for="link in essentialLinks"
:key="link.title"
v-bind="link"
/>
</q-list>
</q-drawer>
<q-page-container>
<router-view />
</q-page-container>
</q-layout>
</template>
类星体应用程序
类星体v{{$q.version}
基本环节
我想这和我的信有关
不过。和他们一起玩不会改变任何事情
我还试着把q-drawer
-标签放在q-page-container
下面,但也没有成功
如何使抽屉在右侧可见?您可以将行为设置为
side=“right”
<template>
<q-layout view="lHh Lpr lFf">
<q-header elevated>
<q-toolbar>
<q-btn
flat
dense
round
icon="menu"
aria-label="Menu"
@click="leftDrawerOpen = !leftDrawerOpen"
/>
<q-toolbar-title>
Quasar App
</q-toolbar-title>
<div>Quasar v{{ $q.version }}</div>
</q-toolbar>
</q-header>
<q-drawer
v-model="leftDrawerOpen"
show-if-above
bordered
content-class="bg-grey-1"
>
<q-list>
<q-item-label
header
class="text-grey-8"
>
Essential Links
</q-item-label>
<EssentialLink
v-for="link in essentialLinks"
:key="link.title"
v-bind="link"
/>
</q-list>
</q-drawer>
<q-page-container>
<router-view />
</q-page-container>
</q-layout>
</template>
基本环节
您可以将行为设置为side=“right”
基本环节
非常感谢!非常感谢你!