Vue实现带白噪音的番茄钟

做了这么久的fcc，看着自己的作品慢慢变的成熟了一点点也是一件欣慰的事。今天记录一下做pomodoro clock的过程和遇到的坑。一开始是从codepen里找别人做的创意然后拼成自己的想法，现在时间不太够，有两个地方没有完成的，希望以后懂的更多 的和有时间的时候能把它完成，一个是获取audio的时候用了DOM，还有一个是想实现背景的从下往上翻页的效果。

CodePen:Pomodoro(vue.js)

先看效果图：

一：定义全局变量

控制时钟有两种变量，一种是记录工作时按钮的状态，分为start，pause和stop，一种是记录工作和休息的状态，分为work和rest。

const states={
	START:'start',
	PAUSE:'pause',
	STOP:'stop'
}
const clock_states={
  WORK:'work',
  REST:'rest'
}

二：定义局部变量

既然是个倒计时，那么需要用到的变量就有minutes和seconds，倒计时还有设置时长和休息的时间，那么就需要一个session和break，最后再加上记录状态的变量就差不多啦。

data(){
    return{
      minutes:minute,
      seconds:second,
      session_value:15,
      break_value:5,
      state:states.STOP,
      clock_st