如何在页面重新加载时保持选定的手风琴处于活动状态

Question

我正在使用物化可折叠的导航。一切正常，除非我重新加载页面。可折叠的已关闭，我必须手动使其再次处于活动状态。如何使可折叠在页面重新加载时保持活动状态？

这是我的代码：

<ul id="slide-out" class="side-nav fixed leftside-navigation">
    <ul class="collapsible" data-collapsible="expandable">
        <li>
            <a class="collapsible-header">
                <i class="material-icons">home</i> Home
            </a>
            <div class="collapsible-body">
                <ul>
                    <li ui-sref-active="active">
                        <a ui-sref="protect" ui-sref-opts="{reload: true}">
                            <i class="material-icons">dashboard</i> Dashboard
                        </a>
                    </li>
                    <li ui-sref-active="active">
                        <a ui-sref="store" ui-sref-opts="{reload: true}">
                            <i class="material-icons">cloud_done</i> Storage
                        </a>
                    </li>
                </ul>
            </div>
        </li>
        <li>
            <a class="collapsible-header">
                <i class="material-icons">event_available</i>Manage
            </a>
            <div class="collapsible-body">
                <ul>
                    <li ui-sref-active="active">
                        <a ui-sref="manage" ui-sref-opts="{reload: true}">
                            <i class="material-icons">storage</i> Manage Storage
                        </a>
                    </li>
                    <li ui-sref-active="active">
                        <a ui-sref="enroll" ui-sref-opts="{reload: true}">
                            <i class="material-icons">file_download</i> Enroll
                        </a>
                    </li>
                </ul>
            </div>
        </li>
    </ul>
</ul>

Answer 1

您想要做的事情与program state 有关，因此除非您保存活动手风琴的name 或id，否则您无法做到这一点。这可以使用浏览器local storage轻松完成。