vue中显示和隐藏如何做动画_Vue框架Element UI教程-出现和隐藏动画（三）

今天继续写组件的运用相关例子

点击按钮的时候，元素会呈现一个出现和隐藏的动画功能。

点击按钮

我会消失在人海之中

export default {

data: () => ({

show: true

})

}

.transition-box {

margin-bottom: 10px;

width: 300px;

height: 100px;

border-radius: 4px;

background-color: #42B983;

text-align: center;

color: #fff;

padding: 40px 20px;

box-sizing: border-box;

margin-left: 520px;

}

效果大家可以自行尝试。

原文作者：祈澈姑娘 技术博客：https://www.jianshu.com/u/05f416aefbe1

90后前端妹子，爱编程，爱运营，文艺与代码齐飞，魅力与智慧共存的程序媛一枚，对于博客上面有不会的问题，欢迎加入编程微刊qq群：260352626。