我在我的网站中使用Bootstrap v5.2可折叠目录。可折叠目录中包含引导卡。一切正常，但当我刷新页面时，第一个可折叠目录项自动激活并打开。如何防止此问题？例如，在刷新页面之前，我将第二个可折叠目录项保持打开状态，而在刷新页面之后，第二个可折叠目录项关闭。并且第一个项目自行打开，尽管它在页面刷新之前已经关闭。

我的 accordion 代码：

<div class="accordion-item">
            <h2 class="accordion-header" id="üretim_kategorisi_header">
              <button class="accordion-button d-block text-center" type="button" data-bs-toggle="collapse"
                data-bs-target="#collapse_üretim" aria-expanded="true" aria-controls="collapse_üretim">
                <h2 class="text-black">Üretim hakkındaki projeler</h2>
              </button>
            </h2>
            <div id="collapse_üretim" class="accordion-collapse collapse show"
              aria-labelledby="üretim_kategorisi_header" data-bs-parent="#proje_kategori_kutusu">
              <div class="accordion-body">

                <div class="container">
                  <div class="row">

                    {{#each projeler as |proje|}}


                    {{#ifeq proje.proje_kategorisi 'Üretim' }}

                    <div class="col-md-4 mb-3">
                      <a data-bs-toggle="modal" data-bs-target="#reg-modal{{proje.id}}"
                        style="text-decoration:none;" href="#">

                        <div class="card">
                          <img class="card-img-top p-2 img-fluid" alt="100%x280"
                            src="../images/randomForLibrary/{{proje.proje_resmi_url}}">
                          <div class="card-body">
                            <h4 class="card-title text-center display-5">
                              {{ proje.proje_ismi}}
                            </h4>
                            <p class="card-text fs-6">

                              {{proje.proje_aciklamasi}}

                            </p>

                            <p class="project_category text-end">
                              {{proje.proje_kategorisi}}
                            </p>

                          </div>

                        </div>

                      </a>
                    </div>

                    {{/ifeq}}



                    {{/each}}

                  </div>
                </div>


              </div>
            </div>
          </div>

          <div class="accordion-item">
            <h2 class="accordion-header" id="arge_kategorisi_header">
              <button class="accordion-button collapsed d-block text-center" type="button"
                data-bs-toggle="collapse" data-bs-target="#collapse_arge" aria-expanded="false"
                aria-controls="collapse_arge">
                <h2 class="text-black">ARGE hakkındaki projeler</h2>
              </button>
            </h2>
            <div id="collapse_arge" class="accordion-collapse collapse" aria-labelledby="arge_kategorisi_header"
              data-bs-parent="#proje_kategori_kutusu">
              <div class="accordion-body">

                <div class="container">
                  <div class="row">

                    {{#each projeler as |proje|}}


                    {{#ifeq proje.proje_kategorisi 'ARGE' }}

                    <div class="col-md-4 mb-3">
                      <a data-bs-toggle="modal" data-bs-target="#reg-modal{{proje.id}}"
                        style="text-decoration:none;" href="#">

                        <div class="card">
                          <img class="card-img-top p-2 img-fluid" alt="100%x280"
                            src="../images/randomForLibrary/{{proje.proje_resmi_url}}">
                          <div class="card-body">
                            <h4 class="card-title text-center display-5">
                              {{ proje.proje_ismi}}
                            </h4>
                            <p class="card-text fs-6">

                              {{proje.proje_aciklamasi}}

                            </p>

                            <p class="project_category text-end">
                              {{proje.proje_kategorisi}}
                            </p>

                          </div>

                        </div>

                      </a>
                    </div>

                    {{/ifeq}}



                    {{/each}}

                  </div>
                </div>


              </div>
            </div>
          </div>
         
        </div>