Question

我想将导航放在左边，而我想把内容放在右边，我正在左侧导航中使用v-navigation-drawer，这是文档https://vuetifyjs.com/ru/components/navigation-drawers/

还是我应该使用CSS在导航和内容的左右位置定位？

<template>
    <v-app>
        <v-card height="400" 
                width="256">
            <v-navigation-drawer permanent>
                <v-list-item>
                    <v-list-item-content>
                        <v-list-item-title class="title">
                            Application
                        </v-list-item-title>
                        <v-list-item-subtitle>
                            subtext
                        </v-list-item-subtitle>
                    </v-list-item-content>
                </v-list-item>

                <v-divider></v-divider>

                <v-list dense nav>
                    <v-list-item v-for="item in items" 
                                 :key="item.title" 
                                 link>
                        <v-list-item-icon>
                            <v-icon>{{ item.icon }}</v-icon>
                        </v-list-item-icon>

                        <v-list-item-content>
                            <v-list-item-title>{{ item.title }}</v-list-item-title>
                        </v-list-item-content>
                    </v-list-item>
                </v-list>
            </v-navigation-drawer>
        </v-card>
        <v-content>
            Here my content
        </v-content>
    </v-app>
</template>
<script>
    export default {
        data() {
            return {
                items: [
                    { title: "Dashboard", icon: "mdi-view-dashboard" },
                    { title: "Photos", icon: "mdi-image" },
                    { title: "About", icon: "mdi-help-box" },
                ],
                right: null,
            };
        },
    };
</script>

这是我的内容

<v-content>
    <div id="app">
        <div id="nav">
            <router-link to="/">Projects</router-link> |
            <router-link to="/about">About</router-link>
        </div>
        <router-view />
    </div>
</v-content>

现在位置是垂直的，我要水平（菜单和内容）

Answer 1

您应该查看Vuefify Application service docs。如果要在永久导航抽屉旁边放置内容，则布局应如下图所示。

stage('Checking Mail List')
        {
          steps{
            script{
if(!(env.REQUIRED_UPLOAD_INSTALL.toBoolean()))
{
 env.mail_list = 'test@testg.com'
}
}
          }
        }

如何将v-navigation-drawer放在左侧，我的内容放在右侧？

1 个答案: