Javascript 物化css可折叠使禁用

在Laravel中使用Materialize CSS，并根据特定情况，我希望能够禁用“可折叠”元素，就像您可以通过添加“disabled”类来轻松使用“Tabs”，如：

<li @if(count($devices) == 0) class="tab col s4 disabled" @else class="tab col s4" @endif><a href="#mydevices">My Devices</a></li>

选项卡元素：

可折叠构件：

但这不适用于可折叠元素。解决方法只是隐藏整个元素，但禁用会向用户显示他们可能会到达的位置，以便进行更多操作等

这就是我想让它失效的地方：

<div @if(count($devices) == 0) class="collapsible-header disabled" @else class="collapsible-header" @endif>My Devices</div>

我的设备

想法/想法受到赞赏：）

我不是一个“Laravel”的家伙，但我可以为您推荐以下HTML/JS/CSS解决方案：

<ul class="collapsible" data-collapsible="accordion">
    <li class="disabled">
      <div class="collapsible-header"><i class="material-icons">filter_drama</i>First</div>
      <div class="collapsible-body"><p>Lorem ipsum dolor sit amet.</p></div>
    </li>
    <li>
      <div class="collapsible-header"><i class="material-icons">place</i>Second</div>
      <div class="collapsible-body"><p>Lorem ipsum dolor sit amet.</p></div>
    </li>
    <li>
      <div class="collapsible-header"><i class="material-icons">whatshot</i>Third</div>
      <div class="collapsible-body"><p>Lorem ipsum dolor sit amet.</p></div>
    </li>
 </ul>

我不是一个“Laravel”的家伙，但我可以为您推荐以下HTML/JS/CSS解决方案：

<ul class="collapsible" data-collapsible="accordion">
    <li class="disabled">
      <div class="collapsible-header"><i class="material-icons">filter_drama</i>First</div>
      <div class="collapsible-body"><p>Lorem ipsum dolor sit amet.</p></div>
    </li>
    <li>
      <div class="collapsible-header"><i class="material-icons">place</i>Second</div>
      <div class="collapsible-body"><p>Lorem ipsum dolor sit amet.</p></div>
    </li>
    <li>
      <div class="collapsible-header"><i class="material-icons">whatshot</i>Third</div>
      <div class="collapsible-body"><p>Lorem ipsum dolor sit amet.</p></div>
    </li>
 </ul>

---

我喜欢。为了保持与标准Materialize相同的主题，我只是更改文本的“颜色”，而不是背景。太好了，谢谢。我喜欢。为了保持与标准Materialize相同的主题，我只是更改文本的“颜色”，而不是背景。太好了，谢谢。