如何在bootstrap-vue中隐藏折叠的导航栏

<template>
  <div>
    <b-navbar toggleable="lg" type="dark" variant="info">
      <b-navbar-toggle target="nav-collapse" visible="false"></b-navbar-toggle>
      <b-navbar-brand href="#">Logo</b-navbar-brand>
      <b-collapse id="nav-collapse" is-nav>
        <b-navbar-nav>
          <b-nav-item href="#">Home</b-nav-item>
          <b-nav-item href="#">About</b-nav-item>
          <b-nav-item href="#">Services</b-nav-item>
          <b-nav-item href="#">Contact</b-nav-item>
        </b-navbar-nav>
      </b-collapse>
    </b-navbar>
  </div>
</template>

<script>
import { BNavbar, BNavbarToggle, BNavbarBrand, BCollapse, BNavbarNav, BNavItem } from 'bootstrap-vue'

export default {
  components: {
    BNavbar,
    BNavbarToggle,
    BNavbarBrand,
    BCollapse,
    BNavbarNav,
    BNavItem
  }
}
</script>