当前位置:网站首页>如何展开Collapse 的所有折叠面板
如何展开Collapse 的所有折叠面板
2022-07-04 05:29:00 【_处女座程序员的日常】
方法:折叠面板默认展开值是activeNames,只需遍历所有的el-collapse-iteme,将其name值插入到
activeNames中即可。
<template>
<div>
<el-collapse v-model="activeNames">
<div v-for="(item,index) in moduleFiles">
<el-collapse-item :title="item.totle" :name="index">
<div>{
{
item.content}}</div>
</el-collapse-item>
</div>
</el-collapse>
</div>
</template>
data() {
return {
moduleFiles:[
{
title:"好好学习",content:"读书不仅仅是为了强大自我,而且是为了中华之崛起"},
{
title:"好好学习",content:"读书不仅仅是为了强大自我,而且是为了中华之崛起"},
{
title:"好好学习",content:"读书不仅仅是为了强大自我,而且是为了中华之崛起"},
{
title:"好好学习",content:"读书不仅仅是为了强大自我,而且是为了中华之崛起"},
],
activeNames:[],
}
},
mounted(){
const open =[];
for(let i=0;i<this.moduleFiles.length;i++){
open.push(i);
}
this.activeNames = open;
}
结果如下:
边栏推荐
- Flask
- Overview of relevant subclasses of beanfactorypostprocessor and beanpostprocessor
- [interested reading] advantageous filtering modeling on long term user behavior sequences for click through rate pre
- flink1.13 sql基础语法(一)DDL、DML
- 数据标注是一块肥肉,盯上这块肉的不止中国丨曼孚科技
- [Excel] 数据透视图
- [technology development -25]: integration technology of radio and television network, Internet, telecommunication network and power grid
- LM小型可编程控制器软件(基于CoDeSys)笔记二十一:错误3703
- [untitled]
- Actual cases and optimization solutions of cloud native architecture
猜你喜欢

19. Framebuffer application programming

Halcon图片标定,使得后续图片处理过后变成与模板图片一样

transformer坑了多少算力
![[QT] timer](/img/df/5db6af851ef19f33fd7e7a7ed46586.png)
[QT] timer

Graduation design of small programs -- small programs of food and recipes

(4) Canal multi instance use

Simulink and Arduino serial port communication
![BUU-Crypto-[GXYCTF2019]CheckIn](/img/b8/ad6c05977f6943f30e9975acb6eb6e.jpg)
BUU-Crypto-[GXYCTF2019]CheckIn

Signification des lettres du module optique et abréviation des paramètres Daquan

Write a complete answer applet (including single choice questions, judgment questions and multiple topics) (III) single choice questions, judgment questions, and the first question display
随机推荐
LM小型可编程控制器软件(基于CoDeSys)笔记二十二:错误4268/4052
Zhanrui tankbang | jointly build, cooperate and win-win zhanrui core ecology
Simulated small root pile
Topological sorting and graphical display of critical path
RSA加密应用常见缺陷的原理与实践
总线的基本概念
JS string splicing enhancement
Daily question brushing record (12)
[paper summary] zero shot semantic segmentation
Two sides of the evening: tell me about the bloom filter and cuckoo filter? Application scenario? I'm confused..
Flutter calls Gaode map app to realize location search, route planning and reverse geocoding
What is MQ?
left_and_right_net可解释性设计
Graduation design of small programs -- small programs of food and recipes
Basic concept of bus
Use of hutool Pinyin tool
Arc135 C (the proof is not very clear)
Enterprise level log analysis system elk (if things backfire, there must be other arrangements)
LM小型可编程控制器软件(基于CoDeSys)笔记二十一:错误3703
Overview of relevant subclasses of beanfactorypostprocessor and beanpostprocessor