Карусель в зависимости от bootstrap. js не работает внутри vue. js компонента - PullRequest
Новая
       29

Карусель в зависимости от bootstrap. js не работает внутри vue. js компонента

0 голосов
/ 17 февраля 2020

В моем public/index.html файле, который я включил 

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>

В моем vue компоненте у меня есть: 

<div id="carousel" class="carousel slide">
 <div class="carousel-inner">
  <div class="dialog carousel-item active">
   <div class="d-block w-100">
    <span>You have <router-link to="/invitations">{{invitationsPending}} Pending Invitation(s)</router-link></span>
   </div>
  </div>
  <div class="dialog carousel-item">
   <div class="d-block w-100">
    <span>Redeem your Free Coffee!</span>
   </div>
  </div>
 </div>
</div>

Код взят из https://getbootstrap.com/docs/4.0/components/carousel/.

Карусель, кажется, не двигается. Даже если я вручную пытаюсь сдвинуть / переместить текст. Я положил ту же карусель в мою public/index.html, и карусель работает. Я полагаю, что браузер не может получить тег script.

Я также попытался вставить это в свой навесной крюк: 

mounted(){
 let script = document.createElement('script')
 script.setAttribute('src', 'https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js')
 document.body.appendChild(script)
}

, но, похоже, ничего не работает ... Как заставить работать карусель?

...