Html Bootstrap4选项卡面板非切换面板

我正在使用Bootstrap4创建4个选项卡面板。当我单击其他选项卡内容时，它们应该淡入淡出。问题是，当我点击其他面板时，什么也没有发生。你知道为什么会这样吗

 <div class="container">
            <div class="row row-content">
                <div class="col-12">
                    <h2>Corporate Leadership</h2>
                    <ul class="nav nav-tabs">
                        <li class="nav-item">
                            <a class="nav-link active" href="#peter"
                                role="tab" data-toggle="tab">Peter Pan, CEO</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="#danny"
                                role="tab" data-toggle="tab">Danny Witherspoon, CFO</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="#agumbe"
                                role="tab" data-toggle="tab">Agumbe, Tang, CTO</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="#alberto"
                                role="tab" data-toggle="tab">Alberto Sommaya, Chef</a>
                        </li>            
                    </ul>

                    <div class="tab-content">
                        <div role="tabpanel" class="tab-pane fade show active" id="peter">
                            <h3>Peter Pan <small>Chief Epicurious Officer</small></h3>
                            <p class="d-none d-sm-block">Our CEO, Peter, credits his hardworking East Asian immigrant parents who undertook the arduous journey to the shores of America with the intention of giving their children the best future. His mother's wizardy in the kitchen whipping up the tastiest dishes with whatever is available inexpensively at the supermarket, was his first inspiration to create the fusion cuisines for which <em>The Frying Pan</em> became well known. He brings his zeal for fusion cuisines to this restaurant, pioneering cross-cultural culinary connections.</p>
                        </div>

                        <div role="tabpanel" class="tab-pane" id="danny">
                            <h3>Dhanasekaran Witherspoon <small>Chief Food Officer</small></h3>
                            <p class="d-none d-sm-block">Our CFO, Danny, as he is affectionately referred to by his colleagues, comes from a long established family tradition in farming and produce. His experiences growing up on a farm in the Australian outback gave him great appreciation for varieties of food sources. As he puts it in his own words, <em>Everything that runs, wins, and everything that stays, pays!</em></p>
                        </div>

                        <div role="tabpanel" class="tab-pane fade" id="agumbe">
                            <h3>Agumbe Tang <small>Chief Taste Officer</small></h3>
                            <p class="d-none d-sm-block">Blessed with the most discerning gustatory sense, Agumbe, our CTO, personally ensures that every dish that we serve meets his exacting tastes. Our chefs dread the tongue lashing that ensues if their dish does not meet his exacting standards. He lives by his motto, <em>You click only if you survive my lick.</em></p>
                        </div>

                        <div role="tabpanel" class="tab-pane fade" id="alberto">
                            <h3>Alberto Somayya <small>Executive Chef</small></h3>
                            <p class="d-none d-sm-block">Award winning three-star Michelin chef with wide International experience having worked closely with whos-who in the culinary world, he specializes in creating mouthwatering Indo-Italian fusion experiences. He says, <em>Put together the cuisines from the two craziest cultures, and you get a winning hit! Amma Mia!</em></p>
                        </div>
                    </div>  
                </div>
             </div>
       </div>

企业领导










彼得·潘首席享乐官
我们的首席执行官彼得（Peter）赞扬了他辛勤工作的东亚移民父母，他们为了给孩子最好的未来，踏上了前往美国海岸的艰苦旅程。他母亲在厨房里用超级市场上便宜的食物烹制出最美味的菜肴，这是他创作融合式菜肴的第一个灵感，煎锅因此而闻名。他将自己对融合美食的热情带到了这家餐厅，开创了跨文化烹饪的联系
Dhanasekaran Witherspoon首席食品官
我们的首席财务官Danny，正如他的同事亲切地提到的那样，来自于农业和农产品方面的悠久家族传统。他在澳大利亚内陆的一个农场长大的经历使他非常欣赏各种各样的食物来源。正如他用自己的话所说的那样，一切运行、胜利和留下的东西都是值得的
Agumbe Tang首席品尝官
拥有最敏锐的味觉，我们的首席技术官Agumbe亲自确保我们提供的每一道菜都符合他的严格口味。我们的厨师担心，如果他们的菜不符合他严格的标准，那么随之而来的就是舌头抽打。他以他的座右铭为生，只有在我舔你之后你才能点击
Alberto Somayya行政总厨
屡获殊荣的米其林三星级厨师，拥有丰富的国际经验。他与烹饪界的who密切合作，擅长创造令人垂涎欲滴的印度-意大利融合体验。他说，把两种最疯狂的文化中的菜肴放在一起，你就会获得成功！安玛米娅

这是您直接复制的代码，工作正常。我会检查以确保您的页面上没有任何重复的ID，因为这些ID可能会导致您看到的内容

企业领导










彼得·潘首席享乐官
我们的首席执行官彼得（Peter）赞扬了他辛勤工作的东亚移民父母，他们为了给孩子最好的未来，踏上了前往美国海岸的艰苦旅程。他母亲在厨房里的巫师在搅打食物
最美味的菜肴，无论什么都可以在超级市场买到，这是他创造融合式烹饪的第一个灵感，煎锅因此而闻名。他把他对融合美食的热情带到了这家餐厅，
开创性的跨文化烹饪联系
Dhanasekaran Witherspoon首席食品官
我们的首席财务官Danny，正如他的同事亲切地提到的那样，来自于农业和农产品方面的悠久家族传统。他在澳大利亚内陆的一个农场长大的经历使他对品种非常欣赏
食物来源的多样性。正如他用自己的话所说的那样，一切运行、胜利和留下的东西都是值得的
Agumbe Tang首席品尝官
拥有最敏锐的味觉，我们的首席技术官Agumbe亲自确保我们提供的每一道菜都符合他的严格口味。我们的厨师担心，如果他们的菜不符合他严格的标准，那么随之而来的就是舌头抽打。
他以他的座右铭为生，只有在我舔你之后你才能点击
Alberto Somayya行政总厨
屡获殊荣的米其林三星级厨师，拥有丰富的国际经验。他与烹饪界的who密切合作，擅长创造令人垂涎欲滴的印度-意大利融合体验。他说，把两种最疯狂的文化中的菜肴放在一起，你就会获得成功！安玛米娅

忘记将以下内容添加到我的HTML页面：

     <!-- jQuery first, then Popper.js, then Bootstrap JS. -->
     <script src="node_modules/jquery/dist/jquery.slim.min.js"></script>
     <script src="node_modules/popper.js/dist/umd/popper.min.js"></script>
     <script src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script>

---

谢谢。你说得对。这部分很好。