7-15播放器progress-circle圆形进度条组件实现
1.首先是引入三步 progress-circle 引入到player.vue中
然后就是 SVG技术
值得注意的事 svg 中 circle里面的 stroke-dasharray属性与 stroke-dashoffset 能控制 可用来控制圆形进度条
7-16播放器模式切换功能实现（上）
改变 播放样式状态 的同时 也要更改 vuex中的 的播放状态
首先 是 计算属性 中 取
然后 是方法中 提交
通知 vuex 改变 vuex 中的状态
一开始的播放状态 是从 vuex中 state.js中取到的
后面更改状态 mode也要做相应的改变
关于 变化按钮状态中 三目运算的连续判断 用法
7-17播放器模式切换功能实现（中）
在chrome中 vue的import 出来的方法 断点监听不到
在上面的方法中
playMode只能通过打印才能看到 谷歌浏览器监听不到 我擦
然后 vuex 仓库中 sequenceList 跟 playlist 是在 点击详细页的时候 action一次性提交的 也就是说 他们那时候的列表是一样的
后来 在改变状态的时候 源代码 是将 sequenceList 取到 然后打乱 通过 shuffle 然后通过
SET_PLAYLIST 也将 playlist 打乱了 也就是
sequenceList 这时候 跟 playlist 保持一致了
这是经典随机打乱数组的方法
(复制我会放在base.js中) 隔天补一下 有个地方没搞懂的代码 我发现在vuex 状态管理器中 getter.js 单单改变其中一个 state.playlist 是不会触发 currentSong
我擦 原来是这样的 .... 经典打乱数组的方法 是不会被监听到数组的变动 因为里面的对象跟属性都没变 只是顺序变了 所以 只能 用索引值 才能进行 当前歌曲的触发
7-18播放器模式切换功能实现（下）
监听能否播放 以及歌曲播放结束后触发事件
经过测试 用this.$refs.audio.currentTime = 0; 只是将时长弄到零 还需
this.$refs.audio.play();进行再次播放
