vant Collapse 折叠面板默认全部展开

需求:进入页面时,要求折叠面板下的内容全部展开
效果图
代码
<div>
   <!--<<van-collapse v-model="activeName"  accordion>>-->//千万注意:accordion要删除掉
   <van-collapse v-model="activeName" > 
      // name="index" 这里同data里定义的数组里保持一致
      <van-collapse-item name="index" title="体检项目及检查结果" icon="shop-o">
         <div v-for="(item, index) in items" :key="index" :value="item.title">
            <template>
              <div class="resultChild" @click="eachResult">{{item.title}}<span class="result_child"><van-icon name="arrow" /></span></div>
              <van-divider />
            </template>
          </div>
        </van-collapse-item>
   </van-collapse>
</div>
data(){
  return{
    activeName: ['index'], // 保持一致
    // 本地模拟数据
    items: [
        { title: "身高体重" },
        { title: "血压" },
        { title: "内科" },
        { title: "外科" },
        { title: "眼科常规检查" }
      ],
    }
}

参考:https://blog.csdn.net/Carrie_Q/article/details/102901141

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。