Vue加动画效果,当动画触发时出现滚动条,怎么不让它出现滚动条?

代码如下:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="./lib/vue-2.4.0.js"></script>
    <script src="./lib/vue-router.js"></script>
    <style>
        body {
            padding: 0;
            margin: 0;
        }

        .router-link-active {
            background-color: #008c8c;
            color: #fff;
            font-style: 700;
            font-size: 20px;
        }

        .v-enter,
        .v-leave-to {
            opacity: 0;
            transform: translateX(50px);
        }

        .v-enter-active,
        .v-leave-active {
            transition: all 0.5s ease;
        }
    </style>
</head>

<body>
    <div id="app">
        <router-link to="/login" tag="span">登录</router-link>
        <router-link to="/register">注册</router-link>
        <transition mode="out-in">
            <router-view></router-view>
        </transition>
    </div>
</body>
<script>
    var login = {
        template: "<h3>登录组件</h3>"
    };
    var register = {
        template: "<h3>注册组件</h3>"
    };
    var routerObj = new VueRouter({
        routes: [
            { path: "/", redirect: "/login" },
            { path: "/login", component: login },
            { path: "/register", component: register }
        ],
    });
    var vm = new Vue({
        el: "#app",
        data: {

        },
        methods: {

        },
        router: routerObj,
    });
</script>

</html>
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐