引入import Vue from 'vue';
import { Panel } from 'vant';
Vue.use(Panel);
代码演示
基础用法
面板只是一个容器,里面可以放入自定义的内容 <van-panel title="标题" desc="描述信息" status="状态">
<div>内容</div>
</van-panel>
高级用法
使用slot自定义内容 <van-panel title="标题" desc="描述信息" status="状态">
<div>内容</div>
<div slot="footer">
<van-button size="small">按钮</van-button>
<van-button size="small" type="danger">按钮</van-button>
</div>
</van-panel>
API
Props
参数 |
说明 |
类型 |
默认值 |
title |
标题 |
string
|
- |
desc |
描述 |
string
|
- |
status |
状态 |
string
|
- |
icon |
标题左侧 图标名称 或图片链接 |
string
|
- |
Slots
名称 |
说明 |
default |
自定义内容 |
header |
自定义 header |
footer |
自定义 footer |
实例演示
|
请发表评论