Vue 编写一个登录页面，使用Tab栏实现“账号登录”和“二维码登录”这两种方式的切换，并通过transition组件结合animate.css实现切换时的动画效果

啵盖儿

于 2021-11-06 15:03:33 发布

阅读量4.2k

点赞数 4

文章标签： css 动画 vue.js

本文链接：https://blog.csdn.net/qq_47119426/article/details/121179325

版权

本文介绍如何使用Vue.js构建一个登录页面，包含账号登录和二维码登录两种方式，通过Tab栏进行切换。同时，利用transition组件和animate.css库实现平滑的动画效果。在实际操作中，遇到二维码登录动画效果不理想的问题，期待解决方案。

摘要由CSDN通过智能技术生成

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>使用Tab栏编写一个登录页面</title>
</head>
<script src="./JS/vue.js"></script>
<!-- 引入animate.css -->
<link rel="stylesheet" href="animate.css">
<style>
    #app{
     
        padding:30px;
        height: 200px;
    }
    .btns{
     
        margin-bottom: 20px;
    }
    .login{

最低0.47元/天解锁文章

啵盖儿

关注

4
点赞
踩
41

收藏

觉得还不错? 一键收藏
2
评论
Vue 编写一个登录页面，使用Tab栏实现“账号登录”和“二维码登录”这两种方式的切换，并通过transition组件结合animate.css实现切换时的动画效果

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>使用Tab栏编写一个登录页面</title></head><script src="./JS/vue.js"></script><link rel="stylesheet" hr
复制链接

扫一扫