Javascript vue js中未触发引导*slide.bs.carousel*事件

这是我生成旋转木马项目的html

<div id="appFeatureimg" class="carousel slide">
    <div class="carousel-inner row w-100 mx-auto">
        <div class="carousel-item col-md-3 col-sm-3 col-3"  :class= "{active: index==0 }" v-for="(screenshot,index) in app_details.screenshots">
            <div class="panel panel-default">
               <div class="panel-thumbnail">
                     <a href="#" class="thumb">
                          <img class="img-fluid mx-auto d-block" :src="screenshot"alt="slide 1" >
                     </a>
               </div>
           </div>
       </div>
   </div>
   <a class="carousel-control-prev" href="#appFeatureimg" role="button" data-slide="prev">
      <span class="carousel-control-prev-icon" aria-hidden="true"></span>
      <span class="sr-only">Previous</span>
   </a>
   <a class="carousel-control-next text-faded" href="#appFeatureimg" role="button" data-slide="next">
      <span class="carousel-control-next-icon" aria-hidden="true"></span>
      <span class="sr-only">Next</span>
   </a>
</div>

VUEJS代码在这里

和其他js代码

 <script>
            vue js code goes here
 </script>

$（文档）.ready（（）=>{
console.log（'ready'）；
$（'appFeatureimg'）。on（'slide.bs.carousel'，（e）=>{
console.log（'ready2'）；
var$e=$（e.relatedTarget）；
var idx=$e.index（）；
var itemsPerSlide=4；
var totalItems=$（'.carousel item'）。长度；
如果（idx>=totalItems-（itemsPerSlide-1））{
var it=itemsPerSlide-（totalItems-idx）；
对于（var i=0；i移动此

<script src="//cdnjs.cloudflare.com/ajax/libs/popper.js/1.13.0/umd/popper.min.js"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<script>
    $( document ).ready(() => {
        console.log('ready');
        $('#appFeatureimg').on('slide.bs.carousel', (e) => {
            console.log('ready2');
            var $e = $(e.relatedTarget);
            var idx = $e.index();
            var itemsPerSlide = 4;
            var totalItems = $('.carousel-item').length;

            if (idx >= totalItems-(itemsPerSlide-1)) {
                var it = itemsPerSlide - (totalItems - idx);
                for (var i=0; i<it; i++) {
                    // append slides to end
                    if (e.direction=="left") {
                        $('.carousel-item').eq(i).appendTo('.carousel-inner');
                    }
                    else {
                        $('.carousel-item').eq(0).appendTo('.carousel-inner');
                    }
                }
            }
        });
    });
</script>

$（文档）.ready（（）=>{
console.log（'ready'）；
$（'appFeatureimg'）。on（'slide.bs.carousel'，（e）=>{
console.log（'ready2'）；
var$e=$（e.relatedTarget）；
var idx=$e.index（）；
var itemsPerSlide=4；
var totalItems=$（'.carousel item'）。长度；
如果（idx>=totalItems-（itemsPerSlide-1））{
var it=itemsPerSlide-（totalItems-idx）；
对于（var i=0；i）您的问题中的源代码格式已损坏。请重新格式化。这样我才能理解并帮助您将其格式化为@PreciousOkwu
$( document ).ready(() => {
        console.log('ready');
        $('#appFeatureimg').on('slide.bs.carousel', (e) => {
            console.log('ready2');
            var $e = $(e.relatedTarget);
            var idx = $e.index();
            var itemsPerSlide = 4;
            var totalItems = $('.carousel-item').length;

            if (idx >= totalItems-(itemsPerSlide-1)) {
                var it = itemsPerSlide - (totalItems - idx);
                for (var i=0; i<it; i++) {
                    // append slides to end
                    if (e.direction=="left") {
                        $('.carousel-item').eq(i).appendTo('.carousel-inner');
                    }
                    else {
                        $('.carousel-item').eq(0).appendTo('.carousel-inner');
                    }
                }
            }
        });