MDUI
首页
注册

原生html与vue不兼容

SparrowHe
2020-09-09 19:31:27

在使用vue直接<div id="app">套上整个网页后,抽屉导航无法正常缩回,具体表现为toolbar正常展开,但抽屉导航栏不隐藏

<body class="mdui-drawer-body-left">
    <div id="app">
        <div class="mdui-toolbar mdui-color-theme">
            <a href="javascript:toggleBar();" class="mdui-btn mdui-btn-icon"><i
                    class="mdui-icon material-icons">menu</i></a>
            <span class="mdui-typo-title">{{ owner }} - {{ name }}</span>
        </div>
        <div class="mdui-drawer" id="drawer" :style="sideStyle">
            <ul class="mdui-list" mdui-collapse="{accordion: true}">
                <li class="mdui-list-item mdui-ripple">
                    <i class="mdui-list-item-icon mdui-icon material-icons">home</i>
                    <div class="mdui-list-item-content" onclick="javascript:window.location.href='/'">Home</div>
                </li>

                <li class="mdui-collapse-item mdui-collapse-item-open">
                    <div class="mdui-collapse-item-header mdui-list-item mdui-ripple">
                        <i class="mdui-list-item-icon mdui-icon material-icons">map</i>
                        <div class="mdui-list-item-content">文章</div>
                        <i class="mdui-collapse-item-arrow mdui-icon material-icons">keyboard_arrow_down</i>
                    </div>
                    <ul class="mdui-collapse-item-body mdui-list mdui-list-dense" id="notes">
                        <li class="mdui-list-item mdui-ripple" :onclick="post.postUrl" v-for="post in posts">{{ post.title }}</li>
                    </ul>
                </li>
        </div>
........