iview收缩框

最新推荐文章于 2023-07-10 10:06:04 发布

原创最新推荐文章于 2023-07-10 10:06:04 发布 · 549 阅读

1 ·

CC 4.0 BY-SA版权

vue 专栏收录该内容

32 篇文章

订阅专栏

本文详细介绍了iView UI框架中的折叠组件使用方法，包括基本用法、自定义触发事件和多级嵌套等特性，帮助开发者更好地理解和应用到实际项目中。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

 <Collapse v-model="value1" style="background: #fff;" simple>
                <Panel name="1" :hide-arrow="true">
                    <Row>
                        <i-col span="2" class="height_border">
                            <div class="title">基本信息</div>
                        </i-col>
                        <i-col span="20" class="height_border"/>
                        <i-col span="1">
                            <Button type="primary" @click.stop="edit">新增</Button>
                        </i-col>
                        <i-col span="1">
                            <Icon type="ios-arrow-down"></Icon>
                        </i-col>
                    </Row>
                    <p slot="content">
                        <Row style="height:25px;"/>
                        <Row>
                            <i-col span="1" class="height_border"/>
                            <i-col span="22">
                                <Table :columns="columns1" :data="personInfoTest" :border="false">
                                    <template slot-scope="{ row }" slot="name">
                                        <strong>{{ row.name }}</strong>
                                    </template>
                                    <template slot-scope="{ row, index }" slot="action">
                                        <Button
                                            type="primary"
                                            size="small"
                                            style="margin-right: 5px"
                                            @click="show(index)"
                                        >编辑</Button>
                                        <Button type="error" size="small" @click="remove(index)">删除</Button>
                                    </template>
                                </Table>
                            </i-col>
                        </Row>
                        <Row style="height:30px;"/>
                    </p>
                </Panel>
            </Collapse>