播放器切换状态,fullScreen的值设置和取值都可以实现,但是播放器的状态切换是失败,老师可以提供一个思路?
来源:1-1 导学
行云流水justdoit
2017-08-06
<p v-show="fullScreen">testfullScreen的值:{{fullScreen}}</p>
<transition name="normal"
@enter="enter"
@after-enter="afterEnter"
@leave="leave"
@after-leave="afterLeave"
>
<div class="normal-player" v-show="fullScreen" >
<div class="background">
<img width="100%" height="100%" :src="currentSong.image">
</div>
<div class="top">
<div class="back" @click="back">
<i class="icon-back"></i>
</div>
<h1 class="title" v-html="currentSong.name"></h1>
<h2 class="subtitle" v-html="currentSong.singer"></h2>
</div>
<div class="middle">
<div class="middle-l">
<div class="cd-wrapper" ref="cdWrapper">
<div class="cd">
<img class="image" :src="currentSong.image">
</div>
</div>
</div>
</div>
<div class="bottom">
<div class="operators">
<div class="icon i-left">
<i class="icon-sequence"></i>
</div>
<div class="icon i-left">
<i class="icon-prev"></i>
</div>
<div class="icon i-center">
<i :class="playIcon" @click="togglePlaying"></i>
</div>
<div class="icon i-right">
<i class="icon-next"></i>
</div>
<div class="icon i-right">
<i class="icon icon-not-favorite"></i>
</div>
</div>
</div>
</div>
</transition>
<transition name="mini">
<div class="mini-player" v-show="!fullScreen" @click="open">
<div class="icon">
<img width="40" height="40" :src="currentSong.image">
</div>
<div class="text">
<h2 class="name" v-html="currentSong.name"></h2>
<p class="desc" v-html="currentSong.singer"></p>
</div>
<div class="control">
<i :class="miniIcon" @click.stop="togglePlaying"></i>
</div>
<div class="control">
<i class="icon-playlist"></i>
</div>
</div>
</transition>


写回答
2回答
-
ustbhuangyi
2017-08-07
对比一下最新的主干代码吧
012017-08-08 -
ustbhuangyi
2017-08-06
你有看我的源码么?
022017-08-06
相似问题