2019-04-24 vue css实现按钮淡入淡出效果 - 简书

具体场景：点击添加显示删除按钮，此时删除按钮淡入；点击删除按钮，删除按钮淡出

代码

点击事件实现

注意：在点击添加按钮，删除按钮淡入时，加定时器是为了实现连续多次可点击添加按钮，删除按钮淡入，不加定时器的效果就是动画只能起一次作用。

实现原理：用ref区别两个按钮，点击添加，对this.$refs.outRef.className（删除按钮）设置淡入效果动画；点击删除，对 this.$refs.outRef.className = 'deleteBtn-hide'（删除按钮本身）设置淡出效果动画。

css实现动画效果

Original url: Access
Created at: 2020-03-10 17:27:03
Category: default
Tags: none

未标明原创文章均为采集，版权归作者所有，转载无需和我联系，请注明原出处，南摩阿彌陀佛，知识，不只知道，要得到

请先后发表评论
  • 最新评论
  • 总共0条评论