文章来源于网络收集而来,版权归原创者所有,如有侵权请及时联系!
<loading>
简介
<loading>
为容器提供上拉加载功能。
注意
<loading>
是<scroller>
、<list>
、<waterfall>
的子组件,只能在被它们包含时才能被正确渲染。
<scroller>
<div v-for="num in lists">
<text>{{num}}</text>
</div>
<loading>
<text>Loading</text>
</loading>
</scroller>
子组件
- 诸如
<text>
、<image>
之类的任何组件,都可以放到<loading>
进行渲染。 - 组件
<loading-indicator>
: 作为<refresh>
和<loading>
的子组件使用,则拥有默认的动画效果实现。
<loading> <text>Loading</text> <loading-indicator></loading-indicator> </loading>
- 组件
<loading-indicator>
: 作为独立组件使用时,通过animating
属性控制动画状态。示例
属性
display
控制<loading>
组件显示、隐藏。display
的设置必须成对出现,即设置display="show"
,必须有对应的display="hide"
。可选值为show / hide
,默认值为show
。
事件
loading
事件:当 <scroller>
、<list>
、<waterfall>
被上拉完成时触发。
<loading @loading="onloading" :display="loadinging ? 'show' : 'hide'">
<text>Loading ...</text>
<loading-indicator></loading-indicator>
</loading>
Vue 示例
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论