vue一个数组默认第一个元素展开

可以通过给数组中的元素添加一个布尔类型的展开标记来实现默认展开第一个元素。具体实现如下：

1. 在数据中添加一个 `expandIndex` 属性，用于记录当前展开的元素的索引，默认为 0。

2. 在模板中使用 `v-for` 循环渲染数组，并使用 `v-if` 指令判断当前元素是否需要展开。

3. 给每个元素添加一个展开按钮，并使用 `v-show` 指令根据展开标记来控制其显示或隐藏。

4. 给每个展开按钮添加一个点击事件，在点击时改变展开标记的值，从而实现展开或收起效果。

示例代码如下：

<template>
  <div>
    <div v-for="(item, index) in list" :key="index">
      <div @click="toggleExpand(index)">
        <span>{{ item.title }}</span>
        <span v-show="expandIndex === index">[-]</span>
        <span v-show="expandIndex !== index">[+]</span>
      </div>
      <div v-if="expandIndex === index">
        {{ item.content }}
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      list: [
        {
          title: '标题1',
          content: '内容1',
        },
        {
          title: '标题2',
          content: '内容2',
        },
        {
          title: '标题3',
          content: '内容3',
        },
      ],
      expandIndex: 0,
    };
  },
  methods: {
    toggleExpand(index) {
      this.expandIndex = this.expandIndex === index ? -1 : index;
    },
  },
};
</script>

在上面的代码中，我们使用 `v-show` 指令来根据 `expandIndex` 展开或隐藏元素，使用 `toggleExpand` 方法来切换展开元素的索引。默认情况下，第一个元素的展开标记为 0，因此默认展开第一个元素。