for循環使用element的折疊面板遇到的問題-2

需求：每次添加一個折疊面板時，讓最新的折疊面板展開，其余的關閉

動態控制展開折疊面板，首先綁定name，v-model = activeName

我們的項目中是當添加折疊面板時，直接push進這個數組collapseData，循環這個數組新建折疊面板

<el-collapse accordion v-model="activeName">

      <el-collapse-item v-for="(item,index) in collapseData" :key="index" :name="index">

        <template slot="title">

          {{item.name}}

          <i class="ssf ssf-colse"  @click.stop="close(item,index)"></i>    

          <!-- 因為項目需要要在每個折疊面板右側添加關閉按鈕，這樣用定位放在右側即可 -->

        </template>

        <div>{{item.content}}</div>

      </el-collapse-item>

    </el-collapse>

需求是點擊新建的時候，最新建的折疊面板展開，其余的折疊面板關閉，就需要用到activeName這個變量，當綁定的name等於activeName時即可

 methods: {
    add() {
      this.collapseData.push({
        name: "王",
        checked: false
      });
      this.activeName = Number(this.collapseData.length) - 1; //每次的activeName都等於數組的最大的值
    }
  }