WeUI for 小程序loadmore加载更多

2018年10月08日 09:07 | 45次浏览 作者原创 版权保护

一、引入小程序weui css样式库,请参考第一章


二、在pages目录中新建目录loadmore以及文件loadmore.wxml,并添加如下代码

<view class="page">
<view class="page__hd">
<view class="page__title">Loadmore</view>
<view class="page__desc">加载更多(www.vxzsk.com V型知识库原创 )</view>
</view>
<view class="page__bd">
<view class="weui-loadmore">
<view class="weui-loading"></view>
<view class="weui-loadmore__tips">正在加载</view>
</view>
<view class="weui-loadmore weui-loadmore_line">
<view class="weui-loadmore__tips weui-loadmore__tips_in-line">暂无数据</view>
</view>
<view class="weui-loadmore weui-loadmore_line weui-loadmore_dot">
<view class="weui-loadmore__tips weui-loadmore__tips_in-line weui-loadmore__tips_in-dot"></view>
</view>
</view>
</view>


三、在根目录app.json配置文件中配置loadmore文件路径,保存后会自动生成对应的js、css等文件

"pages/loadmore/loadmore",


四、给页面设置背景颜色css,在pages/loadmore/loadmore.wxss文件中添加css样式代码

/* pages/loadmore/loadmore.wxss */
page{
background-color: #FFFFFF;
}


五、预览效果


此文章本站原创,地址 https://www.vxzsk.com/1904.html   转载请注明出处!谢谢!

感觉本站内容不错,读后有收获?小额赞助,鼓励网站分享出更好的教程