作者azrael60532 (Kevin)
看板Web_Design
标题[问题] Vue-筛选功能练习
时间Tue Jul 17 15:47:50 2018
问题是这样的
小弟最近刚开始学Vue
想说写个简单的筛选功能
功能是有了，只是我想加上淡入淡出的效果就失败了
我是用Bootstrap的grid + Vue
grid的部分用v-for跑回圈 还是有更好的做法
还请各位前辈批评指教
期望效果:
切换类别时将目前画面的图淡出後再把切换到的图片淡入进来
附上小弟练习的code
https://goo.gl/HFf2Qw
--
※ 发信站: 批踢踢实业坊(ptt.cc), 来自: 220.132.226.51
※ 文章网址: https://webptt.com/cn.aspx?n=bbs/Web_Design/M.1531813673.A.EBE.html
1F：→ fukinhot: fadein fadeout css要自己写, vuejs 有提供transition 07/17 20:16
2F：→ fukinhot: 的component给你包, 会给你各时机的class用, ，资讯请 07/17 20:16
3F：→ fukinhot: 谷歌 vuejs enter/leave & list transitions 07/17 20:16
4F：→ azrael60532: 我有试过用<transition></transition>包起来 07/17 21:47
5F：→ azrael60532: 也有自己写CSS 可是它只有淡入有效果 淡出没有 07/17 21:49
6F：→ azrael60532: 因为v-show的关系grid直接display:none 就没有效果了 07/17 21:50
7F：→ fukinhot: 睡前十分钟帮你小改一下 codepen.io/chaoliou/pen/xJOVj 07/17 23:35
8F：→ fukinhot: 这个才对 codepen.io/chaoliou/pen/xJOVjm 07/17 23:36
9F：→ azrael60532: 感谢大大帮忙 可是这样有个问题就是 07/18 12:38
10F：→ azrael60532: 你选狗或是兔子的时候 前面会空下来 grid不会消失 07/18 12:39
11F：→ fukinhot: 那是为了方便我确认淡入淡出的 07/18 19:33