用vue怎么做出一个div全屏缩屏的过渡效果？

Question

.full-page{
    position:fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

如题，现在页面有个div，旁边有个按钮，我现在是通过按钮点击切换给div赋上一个如上class来切换全屏和缩屏，但是感觉太生硬了，vue的过渡我乍一看每怎么看明白，谁能稍微给我举个例子说明一下用法吗？

Answer 1

Vue 提供了 transition 过渡的封装组件
直接使用建议参考文档：
https://cn.vuejs.org/v2/guide...

Answer 2

http://www.runoob.com/css3/cs...

看看这个

Answer 3

使用 vue-fullscreen 组件
一个用于将任意页面元素进行全屏切换的vue组件