Bootstrap 5 折叠显示/隐藏在使用 JS 调用时不起作用

问题描述

我正在尝试使用 javascript 来显示或隐藏可折叠元素，但不能同时使用两者。 （也就是说我不想启用切换）

根据文档 https://getbootstrap.com/docs/5.0/components/collapse/#via-javascript

我可以做这样的事情来触发显示和隐藏之间的切换

    var myCollapse = document.getElementById('myCollapse')
var bsCollapse = new bootstrap.Collapse(myCollapse,{
  toggle: true
})

当然，如果我将切换更改为 false 它会阻止它做任何事情 - 正如预期的那样。 但是它也说我可以在作为第二个数组传递的对象上使用显示和隐藏属性来启用/禁用这些行为

喜欢

    var myCollapse = document.getElementById('myCollapse')
var bsCollapse = new bootstrap.Collapse(myCollapse,{
  toggle: false,show: true,hide: false
})

但是如果我尝试使用这些选项只能切换工作

我查看了 BS js，发现它确实检查了切换的状态

if (_this._config.toggle) {
    _this.toggle();
  }

然而，显示和隐藏没有等效项，这向我表明 bootstrap.Collapse() 对象的显示和隐藏选项什么都不做。

我是否认为使用 bootstrap.Collapse() 时显示和隐藏选项不起作用？

如果没有，我做错了什么。

解决方法

toggle 既是 config option，又是 method .toggle()

show() 和 hide() 是 methods，不是 配置选项。

因此，使用 show 和 hide 并作为配置选项没有任何作用...

var bsCollapse = new bootstrap.Collapse(myCollapse,{
  toggle: false,show: true,//useless
  hide: false //useless
})

然而，show 和 hide 作为方法工作...

bsCollapse.show()

或

bsCollapse.hide()

Demo