介绍
Sticky 组件与 CSS 中position: sticky属性实现的效果一致，当组件在屏幕范围内时，会按照正常的布局排列，当组件滚出屏幕范围时，始终会固定在屏幕顶部。
引入
import Vue from 'vue';
impo...
AI君
2年前 (2020-03-06) 56℃
0喜欢
引入
import Vue from 'vue';
import { Step, Steps } from 'vant';
Vue.use(Step);
Vue.use(Steps);
代码演示
基础用法
active属性表示当前步骤的...
AI君
2年前 (2020-03-06) 58℃
1喜欢
引入
import Vue from 'vue';
import { Skeleton } from 'vant';
Vue.use(Skeleton);
代码演示
基础用法
通过title属性显示标题占位图，通过row属性配置占位段落...
AI君
2年前 (2020-03-06) 56℃
0喜欢
引入
import Vue from 'vue';
import { Progress } from 'vant';
Vue.use(Progress);
代码演示
基础用法
进度条默认为蓝色，使用percentage属性来设置当前进度...
AI君
2年前 (2020-03-06) 56℃
0喜欢
引入
import Vue from 'vue';
import { Panel } from 'vant';
Vue.use(Panel);
代码演示
基础用法
面板只是一个容器，里面可以放入自定义的内容
<van-panel ...
AI君
2年前 (2020-03-06) 56℃
0喜欢
引入
import Vue from 'vue';
import { NoticeBar } from 'vant';
Vue.use(NoticeBar);
代码演示
基础用法
<van-notice-bar text="通知内...
AI君
2年前 (2020-03-06) 56℃
0喜欢
介绍
瀑布流滚动加载，用于展示长列表，当列表即将滚动到底部时，会触发事件并加载更多列表项。
引入
import Vue from 'vue';
import { List } from 'vant';
Vue.use(List);
代码...
AI君
2年前 (2020-03-06) 59℃
3喜欢
引入
Lazyload 是 Vue 指令，使用前需要对指令进行注册
import Vue from 'vue';
import { Lazyload } from 'vant';
Vue.use(Lazyload);
// 注册时可以配...
AI君
2年前 (2020-03-06) 56℃
2喜欢
引入
ImagePreview和其他组件不同，不是通过HTML结构的方式来使用，而是通过函数调用的方式。使用前需要先引入它。
import Vue from 'vue';
import { ImagePreview } from 'vant...
AI君
2年前 (2020-03-06) 56℃
0喜欢
引入
import Vue from 'vue';
import { Divider } from 'vant';
Vue.use(Divider);
代码演示
基础用法
默认渲染一条水平分割线
<van-divider />...
AI君
2年前 (2020-03-06) 56℃
1喜欢
引入
import Vue from 'vue';
import { CountDown } from 'vant';
Vue.use(CountDown);
代码演示
基本用法
time属性表示倒计时总时长，单位为毫秒
<van...
AI君
2年前 (2020-03-06) 62℃
5喜欢
引入
import Vue from 'vue';
import { Collapse, CollapseItem } from 'vant';
Vue.use(Collapse);
Vue.use(CollapseItem);
代码演...
AI君
2年前 (2020-03-06) 72℃
2喜欢
引入
import Vue from 'vue';
import { Circle } from 'vant';
Vue.use(Circle);
代码演示
基础用法
rate属性表示进度条的目标进度，v-model表示动画过程中的实时...
AI君
2年前 (2020-03-06) 58℃
1喜欢
引入
import Vue from 'vue';
import { Toast } from 'vant';
Vue.use(Toast);
代码演示
文字提示
Toast('提示内容');
加载提示
使用Toast.loading...
AI君
2年前 (2020-03-06) 57℃
1喜欢
引入
import Vue from 'vue';
import { SwipeCell } from 'vant';
Vue.use(SwipeCell);
代码演示
基础用法
SwipeCell组件提供了left和right两个插槽...
AI君
2年前 (2020-03-06) 57℃
1喜欢
引入
import Vue from 'vue';
import { PullRefresh } from 'vant';
Vue.use(PullRefresh);
代码演示
基础用法
下拉刷新时会触发 refresh 事件，在事件的...
AI君
2年前 (2020-03-06) 58℃
1喜欢
介绍
创建一个遮罩层，用于强调特定的页面元素，并阻止用户进行其他操作
引入
import Vue from 'vue';
import { Overlay } from 'vant';
Vue.use(Overlay);
代码演示
基础...
AI君
2年前 (2020-03-06) 66℃
2喜欢
引入
import Vue from 'vue';
import { Notify } from 'vant';
Vue.use(Notify);
代码演示
基础用法
Notify('通知内容');
通知类型
支持primary、su...
AI君
2年前 (2020-03-06) 57℃
0喜欢
引入
import Vue from 'vue';
import { Loading } from 'vant';
Vue.use(Loading);
代码演示
加载类型
通过type属性可以设置加载图标的类型，默认为circular，...
AI君
2年前 (2020-03-06) 55℃
3喜欢
引入
import Vue from 'vue';
import { DropdownMenu, DropdownItem } from 'vant';
Vue.use(DropdownMenu);
Vue.use(DropdownIte...
AI君
2年前 (2020-03-06) 61℃
5喜欢
