a sample form for validation... https://github.com/rafaelpimpa/buefy/issues/153#issuecomment-343611386

Register.vue

<template>
    <div class="container main">
        <section class="section">
            <article class="message">
                <div class="message-header is-info">
                    <p>Register Form</p>
                </div>
                <div class="message-body">
                    <form ref="form" @submit.prevent="onSubmit">
                        <b-field
                            :type="formError.username ? 'is-danger': ''" 
                            :message="formError.username"                    
                        >
                        <b-input
                            placeholder="Username"
                            name="username"
                            v-model="formData.username"
                            @focus="clearInputs"
                            required
                        ></b-input>
                        </b-field>
                        
                        <b-field
                                :type="formError.email ? 'is-danger': ''" 
                                :message="formError.email"                    
                        >
                            <b-input
                                placeholder="E-Mail"
                                name="email"
                                v-model="formData.email"
                                @focus="clearInputs"
                                required
                            ></b-input>
                        </b-field>
                        
                        <b-field 
                                :type="formError.password ? 'is-danger': ''"
                                :message="formError.password"
                        >
                            <b-input
                                placeholder="Password"
                                name="password"
                                type="password"
                                v-model="formData.password"
                                @focus="clearInputs"
                                password-reveal
                                required
                            ></b-input>
                        </b-field>


                        <button 
                            class="button is-success"
                            @click.prevent="onSubmit"
                            :disabled="isDisabled"
                        >
                            Register
                        </button>
                    </form>
                </div>
            </article>

            <b-loading :active.sync="isLoading"  :canCancel="false"></b-loading>

        </section>
    </div>
</template>

<script>
export default {
  data() {
    return {
      isLoading: true,
      isDisabled: true,
      formData: {
        username: "",
        email: "",
        password: ""
      },
      formError: {
        username: "",
        email: "",
        password: ""
      }
    };
  },
  methods: {
    onSubmit() {
      if (this.isDisabled) return;

      this.isDisabled = true;
      this.isLoading = true;

      this.formError.username = "";
      this.formError.email = "";
      this.formError.password = "";

      this.registerUser(this.formData);
    },
    registerUser({ username, email, password }) {
      const query = `
            mutation ($username: String!, $email: String!, $password: String!) {
                register(username: $username, email: $email, password: $password) {
                    ok
                    user {
                        id
                        username
                        email
                    }
                    errors {
                        path
                        message
                    }
                }
            }
        `;

      const vars = { username, email, password };

      this.$http.request(query, vars).then(data => {
        this.isLoading = false;

        if (data.register.ok) {
          this.$toast.open({
            message: "New user created successfuly!",
            type: "is-success",
            position: "is-top-right",
            duration: 4000
          });

          this.$router.push({ name: "home" });
        } else {
          this.showErrors(data.register.errors);

          this.$toast.open({
            message: `Something's not good!!!`,
            type: "is-danger",
            position: "is-top-right",
            duration: 4000
          });
        }
      });
    },
    clearInputs(e) {
      if (e.target && e.target.nodeName == "INPUT") {
        e.target.className = "input";
        this.formError[e.target.name] = "";
      }
    },
    showErrors(errors) {
      if (errors && typeof errors == "object") {
        errors.forEach(({ path, message }) => {
          this.formError[path] = message;
        });
      }
    }
  },
  created() {
    // this works only with html5 validation
    this.$multiwatch(
      ["formData.username", "formData.email", "formData.password"],
      function() {
        const valid = this.$refs.form.checkValidity();
        this.isDisabled = !valid;
      }
    );
  }
};
</script>

<style>
.main {
  width: 550px;
}
.loading-icon {
  position: absolute !important;
  top: 30px !important;
  right: 50px !important;
  font-size: 8px;
}
</style>