Cannot display error messages

[AmazingDreams]

I'm trying to display error messages using server side validation. I can't get it to work.

The input field is not marked as has-error and no error is displayed, even though errors.email and errors.password contain a string. Is there anything wrong with my code?

<template>
  <form-validator :model="errors" @submit="submit">
    <bs-input type="email"
      :model="email"
      :error="errors.email"
      :label="$t('forms.login.email')">
    </bs-input>

    <bs-input type="password"
      :model="password"
      :error="errors.password"
      :label="$t('forms.login.password')">
    </bs-input>
  </form-validator>
</template>

<script>
import {
  input as bsInput,
  formValidator
} from 'vue-strap'

export default {
  name: 'LoginForm',
  components: {
    bsInput,
    formValidator
  },
  data () {
    return {
      email: '',
      password: ''
    }
  },
  computed: {
    errors () { return {} }
  },
  methods: {
    loginError (errors) {
      this.errors = errors
      console.log(errors, errors.password, errors.email)
      this.$emit('loginError')
    },
    loginSuccess (response) {
      this.$emit('loginSuccess')
    },
    submit (event) {
      this.$store.dispatch('login', {
        email: this.email,
        password: this.password
      }).then(this.loginSuccess, this.loginError)
    }
  }
}
</script>

[AmazingDreams]

It does work when I put the field on required. Then it prints

<custom error message> (<vue-strap error message>)

e.g.

This field is required (required)