title: Vue JS change submit button if errors
body: <p>Using Vuex I have a form that when the button is clicked (@click="loader(true)") sends to the loader mutation to change loading to true, which then sets a is-loading class with Bulma CSS to true ('is-loading' : $store.state.index.loading ).</p>
  
  <p>I then receive errors from the server if the form is empty with errors.title, this works fine with the inputs but how do I then set the is-loading class to false if there are errors?</p>
  
  <p>(the code snippet will not work if you run it)
  <div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>export const state = () =&gt; ({
    loading: false
  });
  
  export const mutations = {
    loader(state, value) {
      state.loading = value;
    }
   }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;form @submit.prevent="postThis"&gt;
  
    &lt;div class="field"&gt;
      &lt;div class="control"&gt;
        &lt;input class="input" :class="{ 'is-danger': errors.title }" type="text" id="title" placeholder="I have this idea to..." autofocus="" v-model="newTitle"&gt;
  
      &lt;/div&gt;
      &lt;p class="is-size-6 help is-danger" v-if="errors.title"&gt;
        {{ errors.title[0] }}
      &lt;/p&gt;
    &lt;/div&gt;
  
    &lt;div class="field"&gt;
      &lt;div class="control"&gt;
  
        &lt;button @click="loader(true)" type="submit" :class="{'is-loading' : $store.state.index.loading }"&gt;
          Post
        &lt;/button&gt;
  
  
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/form&gt;
  
  &lt;script&gt;
    import {mapMutations,} from 'vuex';
    methods: {
      ...mapMutations({
        loader: 'index/loader'
      })
    }
  &lt;/script&gt;</code></pre>
  </div>
  </div>
  </p>