无法使BS5 Toast自动隐藏

Question

我刚在一个网站上加了一些祝酒词。他们表现的绝对好，确切的时候他们应该做，但他们不自动隐藏。我怎么定义这些属性似乎并不重要。根据文档: data-bs-autohide有一个默认值

<div class="toast show" role="assertive" aria-live="polite" aria-atomic="true">
    <div class="toast-header">
        <svg class="rounded me-3" width="20" height="20" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid slice" focusable="false" role="img">
            <rect fill="#62c462" width="100%" height="100%" class="me-3 rounded"></rect>
        </svg>
        <strong class="me-auto">TITLE</strong>
        <button type="button" class="btn-close" data-bs-dismiss="toast"></button>
    </div>
    <div class="toast-body">
        some body text
    </div>
</div>

到主页看看会发生什么..。当页面加载时(如预期的)，吐司会出现在左上角，但在5秒后不会消失。

我在主吐司DIV中添加了data-bs-animation="true" data-bs-autohide="true" data-bs-delay="2000"，期望行为会有某种变化(加载/隐藏时会有某种动画，2秒后会自动隐藏)，但什么也没有.就像我添加附加数据-bs-xxx标签之前一样，无限期地停留在那里。

我看到了其他一些关于这个问题的帖子，他们使用的是Bootstra5.0.2(我使用的是5.2.0)，所以我尝试使用旧的BS5发行版，但行为仍然完全相同。

这里的任何帮助都会很好--很明显，我错过了一些简单的/显而易见的东西。

谢谢..。

Answer 1

解决了它..。我从主吐司中去掉了.show类，用JavaScript初始化了祝酒词.然后数据-bs-xxx中的参数就像预期的那样工作。