需求:进入页面时,要求折叠面板下的内容全部展开
代码
<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