5-4小节中，用了Velocity后，第二次再点击按钮，hello world回不来是怎么回事呀-慕课网

慕先生3442787 2018-11-26 16:25:52

控制显示隐藏的方法是“v-show”，‘v-show’隐藏的原理是将样式diaplay设置为none，此时元素的opacity还是1，所以写一个leave把opacity设为0可解决。或者使用‘v-if’，v-if每次切换都会重新渲染。

1 回复有任何疑惑可以回复我~

慕前端6263329 #1

所以写一个leave把opacity设为0可解决,你能把你说的解决方式用代码实现一下吗？我试了你说的方法，没有任何意义。除非执行enter的逆过程。主要想理解原理~麻烦大佬告知一二...

回复有任何疑惑可以回复我~ 2019-01-21 16:19:39

weixin_慕UI5568240 2019-09-18 15:35:37

这样解释不太对呀，opacity即使是1，在下次的before-enter中还是会把opacity改为0的呀。所以应该不是这个的问题

0 回复有任何疑惑可以回复我~

收起回答

提问者 Aaron叶 2018-10-30 02:09:00

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Title</title>    <script src="vue.j
s"></script>    <script src="Velocity.js"></script></head><body>    <div id="app">        <transition @before-enter="handBeforeEnter" @enter="handEnter" @after-enter="handAfterEnter" @before-leave="handBeforeLeave" @leave="handLeave" @after-leave="handAfterLeave">            <div v-show="show">hello world</div>        </transition>        <button @click="handldClick">点击</button>    </div>    <script> var vm = new Vue({            el : '#app', data : {                show: true }, methods : {                handldClick : function () {                    this.show = !this.show }, handBeforeEnter : function (el) {                    el.style.opacity = 0 }, handEnter : function (el, done) {                    Velocity(el, {                            opacity : 1 }, {                            duration :1000, complete:done                        })                }, handAfterEnter : function (el) {                    console.log('动画结束')                }            }        })    </script></body></html>

这是我写的代码

0 回复有任何疑惑可以回复我~

收起回答

慕前端6263329 #1
```
你解决了么？
```
回复有任何疑惑可以回复我~ 2019-01-21 16:20:03

5-4小节中，用了Velocity后，第二次再点击按钮，hello world回不来是怎么回事呀

正在回答回答被采纳积分+3

3回答

相似问题

请选择置顶位置

本课精华内容

今天新建了一个分支，git pull时发现报错

我的也是，进入的动画没有效果

首页swiper的轮播失效

6-3 按老师的操作改了路由但是显示主页的仍然是去哪儿网的页面

swiper找不到module

【讨论题】Composition API 应用时注意得问题

【讨论题】Composition API 产生背景及解决问题

【讨论题】作为前端，你在开发中是如何进行代码调试 Debug

【讨论题】移动端项目的开发过程中，你遇到过怎样的兼容性问题？

【讨论题】对前端数据管理框架，你有怎样的理解？

热搜

最近搜索清空