Expected behavior

use named routes in :to bind without errors

Actual behavior

Vue raises warning stating invalid prop type:

[Vue warn]: Invalid prop: type check failed for prop "to". Expected String with value "[object Object]", got Object 

found in

---> <MdbNavbarBrand> at node_modules/mdbvue/src/components/NavbarBrand.vue
       <MdbNavbar> at node_modules/mdbvue/src/components/Navbar.vue
         <NavBar> at src/components/NavBar.vue
           <App> at src/App.vue
             <Root>

Resources (screenshots, code snippets etc.)

My Code:

<template>
  <mdb-navbar class="elegant-color-dark" dark>
    <mdb-navbar-brand :to="{ name: 'home' }">
      Division 2
    </mdb-navbar-brand>
    <mdb-navbar-toggler>
      <mdb-navbar-nav>
        <mdb-nav-item :to="{ name: 'equipment' }">
          All
        </mdb-nav-item>
        <mdb-nav-item :to="{ name: 'weapons' }">
          Weapons
        </mdb-nav-item>
      </mdb-navbar-nav>
    </mdb-navbar-toggler>
  </mdb-navbar>
</template>
<script>
import {
  mdbNavbar,
  mdbNavbarBrand,
  mdbNavbarToggler,
  mdbNavbarNav,
  mdbNavItem
} from 'mdbvue'

export default {
  name: 'NavBar',
  data() {
    return {}
  },
  components: {
    mdbNavbar,
    mdbNavbarBrand,
    mdbNavbarToggler,
    mdbNavbarNav,
    mdbNavItem
  }
}
</script>

Error: