Bootstrap 4.3.1中的nav-item在元素后面没有显示黑条

Question

我在App.vue中有以下代码：

  <li class="nav-item" v-else @click="langDropdown = false">

    <a href="#" class="nav-link inline" @click="modal = 'login'"><i style="vertical-align:sub;"><icon name="sign-in" scale="1.5"  class="icon"></icon></i>   {{$t('account.login')}}</a> 

    <a href="#" class="nav-link inline" @click="modal = 'register'"><i style="vertical-align:sub;"><icon name="user-plus" scale="1.5"  class="icon"></icon></i>   {{$t('account.register')}}</a>
  </li>
  <li class="nav-item nav-link">
    <a href="" class="nav-link link-toggle"><i style="vertical-align:sub;"><icon name="question-circle" scale="1.5"  class="icon"></icon></i>   {{$t('dashboard.common.support')}} </a>
  <a href="" >
  <div class="navbar-toggler">
      <icon name="question-circle" scale="2" class="icon"></icon>
    </div>
    </a>
  </li>
  <li class="nav-item nav-link dropdown" @click="dropdownOpen = false" :class="{'show': langDropdown}">

    <a class="nav-link dropdown-toggle user-nav" @click="langDropdown = !langDropdown" style="color: white; cursor: pointer; "><i style="vertical-align:sub;"><icon name="globe" scale="1.5" class="icon"></icon></i>   {{selectedLanguage}}</a>

    <div @click="langDropdown = !langDropdown" class="navbar-toggler">
      <icon name="globe" scale="2" class="icon"></icon>
    </div>
    <div class="dropdown-menu dropdown-menu-right" @click="langDropdown = !langDropdown">
      <a class="dropdown-item" @click="lang('en')">English</a>
      <a class="dropdown-item" @click="lang('zh')">中文</a>
    </div>
  </li>

我正在使用Bootstrap 4.3.1和Vue 2.3.3。在登录，注册和语言后面没有显示黑条。在我从Webpack 2升级到Webpack 4之前，它确实做到了。但是现在我已经排除了Bootstrap-Vue并正常使用Bootstrap了，它不起作用，并且在它们后面也没有显示黑条。我该怎么办？