source

NavMenu가 요소 UI에서 응답할 수 있습니까?

goodcode 2022. 8. 3. 23:13
반응형

NavMenu가 요소 UI에서 응답할 수 있습니까?

vue.js와 element-ui 컴포넌트를 기반으로 응답성이 뛰어난 SPA를 만들려고 합니다.개봉 후 바로 반응하는 레이아웃으로 동작은 정상이지만 모바일 기기에서는 NavMenu(el-menu) 컴포넌트를 위로 이동시키거나 '버거' 아래에 숨기는 방법을 알 수 없습니다.
현재 결과는 내용 위의 세로 메뉴일 뿐이므로 잠시 아래로 스크롤해야 합니다.
내 앱.vue 레이아웃:

<el-row>
    <el-col>
        <el-row type="flex" justify="space-between" align="middle">
            <el-col :span="6">
                <img src="/Assets/images/logo.png" width="64px" align="left" />
                <h2>Admin</h2>
            </el-col>
            <el-col :span="2">
                <sign-in></sign-in>
            </el-col>
        </el-row>
        <el-row :gutter="10">
            <el-col :xs="3" :lg="8" :xl="3">
                <el-menu v-if="user.authenticated" style="min-height: 960px; background-color: #fff" v-bind:router="true">
                    <el-menu-item index="/offers">
                        <i class="el-icon-star-off"></i>
                        <span>Offers</span>
                    </el-menu-item>
                    ...
                </el-menu>
            </el-col>
            <el-col :xs="21" :lg="16" :xl="21">
                <router-view style="width:100%;"></router-view>
            </el-col>
        </el-row>
    </el-col>
</el-row>

Element는 모바일 플랫폼용으로 설계된 것이 아니라 백스테이지 관리 시스템용으로 설계되었습니다.나는 그 팀이 반응성 있는 디자인을 지원할 계획이 있는지 잘 모르겠다.한편, Element 팀은 유연한 레이아웃을 만들기 위해 응답성 그리드 시스템을 제공합니다.

응답성이 뛰어난 네비게이션메뉴를 구축하는 것을 검토하고 있는 경우는, 그 네비게이션메뉴를 스스로 실장해, 케이스를 실현할 필요가 있습니다.

사람들의 생활을 조금 더 편리하게 하기 위해 며칠 전에 Element를 사용하여 간단한 응답 메뉴 템플릿을 만들었습니다.

이게 당신에게 도움이 되길 바랍니다. 아이디어를 얻으려면.

언급URL : https://stackoverflow.com/questions/48306392/can-a-navmenu-be-responsive-in-element-ui

반응형