我想在页面里实现页面顶部下拉刷新和页面底部上拉加载更多的功能,于是同时使用了loading和refresh组件,遗憾的是下拉刷新没问题,上拉加载更多却不行。屏蔽掉下拉刷新后上拉加载正常。基于此,我产生了一个疑问,他们不能在一起使用吗?
代码如下:
<template>
<div class="course-wrap">
<app-header :center="title"></app-header>
<scroller :style="{height:height}">
<refresh class="refresh-view" @refresh="reload" :display="reloading">
<text v-if="reloading=='hide'">下拉刷新</text>
<loading-indicator class="indicator"></loading-indicator>
</refresh>
<div class="search-group">
<input type="text" placeholder="搜索" class="input" v-model="courseParameter"/>
<image class="img" src="./pic/search.png"></image>
</div>
<div class="course-panel">
<div class="course-group" v-for="course in courseArray" @click="showCourse(course)">
<text class="header">{{course.title}}</text>
<text class="content" lines="3">{{course.summary}}</text>
<div class="footer">
<text class="author">作者:{{course.publisher}} </text>
<text class="read-count">阅读量:{{course.readAmount}}</text>
</div>
</div>
</div>
<loading @loading="loadMore" :display="showLoading">
<text v-if="showLoading=='hide'">加载更多</text>
<loading-indicator class="indicator"></loading-indicator>
</loading>
</scroller>
</div>
</template>
我之前也发现这个问题,两个只能留一个。