vue慕课网音乐项目手记：22-点击返回以及随机播放按钮的实现

simoonQian

于 2018-05-18 13:00:58 发布

阅读量472

点赞数

分类专栏： vue音乐

本文链接：https://blog.csdn.net/weixin_40814356/article/details/80362922

版权

vue音乐专栏收录该内容

61 篇文章 2 订阅

订阅专栏

1、点击返回：添加click事件，然后：

 back () {
  this.$router.back()
}

2、随机播放按钮：

<div class="play-wrapper">
        <div class="play" v-if="songs.length>0" ref="play">
          <i class="icon-play"></i>
          <span class="text">随机播放全部</span>
        </div>
      </div>

.play-wrapper
        position absolute
        bottom 20px
        z-index 50
        width 100%
        .play
          box-sizing border-box
          width 135px
          padding 7px 0
          margin 0 auto
          text-align center
          border 1px solid $color-theme
          color $color-theme
          border-radius 100px
          font-size 0
          .icon-play
            display inline-block
            vertical-align middle
            margin-right 6px
            font-size $font-size-medium-x
          .text
            display inline-block
            vertical-align middle
            font-size $font-size-small