title: how to use setInterval in vue component
body: <p>I define the timer in each my-progress, used to update the value of view, but the console shows the value of the constant changes, and the value of view is still not changed, how can I do in the timer to change the value of view</p>
  
  <pre><code>Vue.component('my-progress', {
      template: '\
              &lt;div class="progress progress-bar-vertical" data-toggle="tooltip" data-placement="top"&gt;\
                  &lt;div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" :style="{height: pgvalue}"&gt;{{pgvalue}}\
                  &lt;/div&gt;\
              &lt;/div&gt;\
          ',
      data : function(){  
  
          return {
              pgvalue : '50%',
              intervalid1:'',
          }
      },
      computed:{
  
          changes : {
              get : function(){
                  return this.pgvalue;
              },
              set : function(v){
                  this.pgvalue =  v;
              }
          }
      },
      mounted : function(){
  
          this.todo()     
      },
      beforeDestroy () {
  
         clearInterval(this.intervalid1)
      },
      methods : {
  
          todo : function(){          
              this.intervalid1 = setInterval(function(){
                  this.changes = ((Math.random() * 100).toFixed(2))+'%';
                  console.log (this.changes);
              }, 3000);
          }
      },
  })
  </code></pre>
  
  <p>here is the link:
  <a href="http://jsbin.com/safolom/edit?html" rel="noreferrer">jsbin.com/safolom</a></p>