Twitter bootstrap 升级后引导手风琴损坏

Twitter bootstrap 升级后引导手风琴损坏,twitter-bootstrap,bootstrap-4,Twitter Bootstrap,Bootstrap 4,我一直在论坛里寻找类似的东西,但没能确定下来。下面是我的代码简化后的代码块: <div id="line-up" class="container"> <div class="text-center"> <button class="btn btn-default filter-button m-1" data-toggle="collapse" data-target="#main" data-parent="#line-u

我一直在论坛里寻找类似的东西,但没能确定下来。下面是我的代码简化后的代码块:

<div id="line-up" class="container">
        <div class="text-center">
            <button class="btn btn-default filter-button m-1" data-toggle="collapse" data-target="#main" data-parent="#line-up"><p>Mainstage</p></button>
            <button class="btn btn-default filter-button m-1" data-toggle="collapse" data-target="#dub" data-parent="#line-up"><p>Dub Castle</p></button>
            <button class="btn btn-default filter-button m-1" data-toggle="collapse" data-target="#kids" data-parent="#line-up"><p>Kids Village</p></button>
            <p class="mt-2 mb-2"><span class="text-danger">The line-up is <u>not</u> complete!</span> Estimated date of completion is June.</p>
        </div>
        <div class="accordion-group">
            <div class="collapse show indent" id="main">
                XXX
            </div>
            <div class="collapse indent" id="dub">
                YYY
            </div>
            <div class="collapse" id="kids">
                ZZZ
            </div>
        </div>
    </div>
我曾经测试我的引导CSS或JS文件是否有问题

在我从4.0.0升级到4.2.1之前,这段代码在引导CSS&JS中运行良好。我还没有弄明白这个问题。顶部的按钮用于在XXX、YYY和ZZZ之间切换,XXX在开始时可见,在YYY或ZZZ出现时隐藏

谢谢你的帮助

数据父项在4.1之后更改。它应该放在可折叠div中,而不是折叠切换

<div class="accordion-group">
    <div class="collapse show indent" id="main" data-parent="#line-up">
        XXX
    </div>
    <div class="collapse indent" id="dub" data-parent="#line-up">
        YYY
    </div>
    <div class="collapse" id="kids" data-parent="#line-up">
        ZZZ
    </div>
</div>

谢谢这似乎合乎逻辑。我在笔记上没有注意到。