title: VueJS: clicking disabled button still changes route
body: <p>I'm trying to disable a button when <code>currentpage</code> is <code>firstpage</code>:</p>
  
  <p><img src="https://i.stack.imgur.com/wodrV.png" alt="enter image description here"></p>
  
  <p>The button disables correctly but the route still changes when it is clicked.</p>
  
  <p><strong>javascript</strong> </p>
  
  <pre><code>checkDisable() {
    if (this.currentPage==1) {
      document.getElementById("previousBtn").disabled = true;
    }
  }
  </code></pre>
  
  <p><strong>vue js</strong></p>
  
  <pre><code>&lt;router-link :to="{ name: 'products', params: {page: currentPage-1 }}"&gt;
     &lt;button id="previousBtn" class="btn btn-default" v-bind="checkDisable()"&gt;
       Previous
     &lt;/button&gt;
  &lt;/router-link&gt;
  </code></pre>