Skip to content

Commit

Permalink
v0.3.1-released
Browse files Browse the repository at this point in the history
  • Loading branch information
@SmileZXLee
SmileZXLee committed Dec 3, 2024
1 parent e4fb373 commit c57185f
Show file tree
Hide file tree
Showing 5 changed files with 66 additions and 26 deletions.
4 changes: 4 additions & 0 deletions z-paging-x/uni_modules/z-paging-x/changelog.md
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
## 0.3.1（2024-12-03）
1.`新增` events：`@refresherpulling`、`@refresherrefresh`、`@refresherrestore`、`@refresherabort`、`@scrolltolower`、`@scrolltoupper`、`@refresherStatusChange`、`@loadMoreStatusChange`。
2.`新增` slot="empty"。
3.`新增` `scrollToTop`、`scrollToBottom`、`scrollToY`添加是否展示滚动动画参数。
## 0.3.0（2024-10-13）
1.`新增` 添加编译到web的支持。
2.`优化` 布局方式，使布局更灵活。
Expand Down
10 changes: 5 additions & 5 deletions z-paging-x/uni_modules/z-paging-x/components/z-paging-x/enums/index.uts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,33 +40,33 @@ type EnumType = {
}

export default {
//当前加载类型 0.下拉刷新 1.上拉加载更多
// 当前加载类型 0.下拉刷新 1.上拉加载更多
LoadingType: {
Refresher: 0,
LoadingMore: 1
},
//下拉刷新状态 0.默认状态 1.松手立即刷新 2.刷新中 3.刷新结束
// 下拉刷新状态 0.默认状态 1.松手立即刷新 2.刷新中 3.刷新结束
Refresher: {
Default: 0,
ReleaseToRefresh: 1,
Loading: 2,
Complete: 3
},
//底部加载更多状态 0.默认状态 1.加载中 2.没有更多数据 3.加载失败
// 底部加载更多状态 0.默认状态 1.加载中 2.没有更多数据 3.加载失败
More: {
Default: 0,
Loading: 1,
NoMore: 2,
Fail: 3
},
//@query触发来源 0.用户主动下拉刷新 1.通过reload触发 2.通过refresh触发 3.通过滚动到底部加载更多或点击底部加载更多触发
// @query触发来源 0.用户主动下拉刷新 1.通过reload触发 2.通过refresh触发 3.通过滚动到底部加载更多或点击底部加载更多触发
QueryFrom: {
UserPullDown: 0,
Reload: 1,
Refresh: 2,
LoadingMore: 3
},
//列表缓存模式
// 列表缓存模式
CacheMode: {
//默认模式，只会缓存一次
Default: 'default',
Expand Down
39 changes: 30 additions & 9 deletions z-paging-x/uni_modules/z-paging-x/components/z-paging-x/z-paging-x.uvue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
/___| | .__/ \__,_|\__, |_|_| |_|\__, |
|_| |___/ |___/ X

v0.3.0 (2024-07-08)
v0.3.1 (2024-12-03)
by ZXLee
-->
<!-- 文档地址：https://z-paging.zxlee.cn -->
Expand All @@ -21,7 +21,7 @@ by ZXLee
<list-view v-if="listIs === 'list-view'" ref="zpxList" class="zpx-list-view zpx-flex1"
:id="listId" :refresher-enabled="refresherEnabled" :refresher-threshold="finalRefresherThreshold" :refresher-triggered="refresherTriggered" :refresher-default-style="useCustomRefresher ? 'none' : 'black'" :custom-nested-scroll="customNestedScroll" :refresher-background="refresherBackground"
:rebound="rebound" :scroll-top="scrollTop" :show-scrollbar="showScrollbar" :scroll-with-animation="finalScrollWithAnimation"
@refresherpulling="_onRefresherpulling" @refresherrefresh="_onRefresherrefresh" @scrolltolower="_onScrolltolower" @scroll="_onScroll"
@refresherpulling="_onRefresherpulling" @refresherrefresh="_onRefresherrefresh" @refresherrestore="_onRefresherrestore" @refresherabort="_onRefresherabort" @scrolltolower="_onScrolltolower" @scrolltoupper="_onScrolltoupper" @scroll="_onScroll"
@startnestedscroll="_onStartNestedScroll" @nestedprescroll="_onNestedPreScroll">
<slot />
<component :is="listItemIs">
Expand All @@ -36,14 +36,15 @@ by ZXLee
<z-paging-refresher ref="commonRefresher" :default-text="refresherDefaultText" :pulling-text="refresherPullingText" :refreshing-text="refresherRefreshingText" v-else :status="refresherStatus" :show-update-time="showRefresherUpdateTime" :update-time-key="refresherUpdateTimeKey" :time-text-timestamp="refresherTimeTextTimestamp"/>
</view>
</component>
<component :is="listItemIs" class="zpx-flex1">
<z-paging-x-empty v-if="showEmpty" :empty-text="!isLoadFailed ? emptyText : emptyErrorText" :empty-img="!isLoadFailed ? emptyImg : emptyErrorImg" :is-load-failed="isLoadFailed" :show-empty-reload="isLoadFailed" @reload="reload"/>
<component v-if="showEmpty" :is="listItemIs" class="zpx-flex1">
<slot v-if="$slots['empty']" :isLoadFailed="isLoadFailed" name="empty" />
<z-paging-x-empty v-else :empty-text="!isLoadFailed ? emptyText : emptyErrorText" :empty-img="!isLoadFailed ? emptyImg : emptyErrorImg" :is-load-failed="isLoadFailed" :show-empty-reload="isLoadFailed" @reload="reload"/>
</component>
</list-view>
<scroll-view v-else ref="zpxList" class="zpx-list-view zpx-flex1"
:id="listId" :refresher-enabled="refresherEnabled" :refresher-threshold="finalRefresherThreshold" :refresher-triggered="refresherTriggered" :refresher-default-style="useCustomRefresher ? 'none' : 'black'" :custom-nested-scroll="customNestedScroll" :refresher-background="refresherBackground"
:rebound="rebound" :scroll-top="scrollTop" :show-scrollbar="showScrollbar" :scroll-with-animation="finalScrollWithAnimation"
@refresherpulling="_onRefresherpulling" @refresherrefresh="_onRefresherrefresh" @scrolltolower="_onScrolltolower" @scroll="_onScroll"
@refresherpulling="_onRefresherpulling" @refresherrefresh="_onRefresherrefresh" @refresherrestore="_onRefresherrestore" @refresherabort="_onRefresherabort" @scrolltolower="_onScrolltolower" @scrolltoupper="_onScrolltoupper" @scroll="_onScroll"
@startnestedscroll="_onStartNestedScroll" @nestedprescroll="_onNestedPreScroll">
<slot />
<component :is="listItemIs">
Expand Down Expand Up @@ -341,7 +342,13 @@ by ZXLee
watch: {
totalData(newVal: any[]) {
this.$emit('update:modelValue', newVal);
}
},
refresherStatus(newVal: number) {
this.$emit('refresherStatusChange', newVal);
},
loadMoreStatus(newVal: number) {
this.$emit('loadMoreStatusChange', newVal);
},
},
mounted() {
this.$zpxList = this.$refs['zpxList'] as UniElement;
Expand Down Expand Up @@ -476,16 +483,30 @@ by ZXLee
},
// 下拉刷新控件被下拉事件
_onRefresherpulling(e: RefresherEvent) {
this.$emit('refresherpulling', e);
this.refresherStatus = e.detail.dy < this.finalRefresherThreshold ? Enum.Refresher.Default : Enum.Refresher.ReleaseToRefresh;
},
// 下拉刷新被触发事件
_onRefresherrefresh(_: RefresherEvent) {
this.$emit('refresh');
_onRefresherrefresh(e: RefresherEvent) {
this.$emit('refresherrefresh', e);
this._handleRefresh();
},
// 下拉刷新被复位事件
_onRefresherrestore(e: RefresherEvent) {
this.$emit('refresherrestore', e);
},
// 下拉刷新被中止事件
_onRefresherabort(e: RefresherEvent) {
this.$emit('refresherabort', e);
},
// 滚动到底部事件
_onScrolltolower() {
_onScrolltolower(e: ScrollToLowerEvent) {
this._handleLoadMore();
this.$emit('scrolltolower', e);
},
// 滚动到顶部事件
_onScrolltoupper(e: ScrollToUpperEvent) {
this.$emit('scrolltoupper', e);
},
// 列表正在滚动事件
_onScroll(e: ScrollEvent) {
Expand Down
5 changes: 4 additions & 1 deletion z-paging-x/uni_modules/z-paging-x/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
"id": "z-paging-x",
"name": "z-paging-x",
"displayName": "【z-paging-x下拉刷新、上拉加载】z-paging uniappx版已上线！",
"version": "0.3.0",
"version": "0.3.1",
"description": "分页全自动处理，支持自定义下拉刷新、上拉加载更多、自动管理空数据图、点击返回顶部、下拉显示最后更新时间等，持续完善中",
"keywords": [
"uniapp-x",
Expand Down Expand Up @@ -50,6 +50,9 @@
"vue3": "y"
},
"App": {
"app-android": "u",
"app-harmony": "u",
"app-ios": "u"
},
"H5-mobile": {
"Safari": "u",
Expand Down
34 changes: 23 additions & 11 deletions z-paging-x/uni_modules/z-paging-x/readme.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
<img alt="logo" src="https://z-paging.zxlee.cn/img/title-logo-x.png" height="100" style="margin-bottom: 50px;">
</p>


<h2 style="color: red">请注意，此插件仅支持uniappx！！！若您为uniapp项目请使用z-paging！</h2>

> z-paging uniapp x版
Expand Down Expand Up @@ -89,8 +90,11 @@ npm update z-paging-x
```

### props

#### 支持全局配置（非必须）

在`main.uts`中

```uts
import { setZPXConfig } from '@/uni_modules/z-paging-x/components/z-paging-x/config/index.uts'
Expand Down Expand Up @@ -127,8 +131,9 @@ setZPXConfig({
| nested-scroll-child | (仅listIs = scroll-view有效)嵌套滚动子元素的id属性，不支持ref，scroll-view惯性滚动时会让对应id元素视图进行滚动，子元素滚动时会触发scroll-view的`nestedprescroll`事件，嵌套子元素需要设置`custom-nested-scroll` = true | String | '' | - |

#### reload相关配置
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
| :----------------------------- | :----------------------------------------------------------- | :------ | :----- | :----- |

| 参数 | 说明 | 类型 | 默认值 | 可选值 |
| :------------------------ | :----------------------------------------------------------- | :------ | :----- | :----- |
| scroll-to-top-when-reload | reload时自动滚动到顶部(如果reload时list被清空导致占位消失也可能会自动返回到顶部，因此如果是这种情况还需要将`clean-list-when-reload`设置为false) | Boolean | true | false |
| clean-list-when-reload | reload时立即自动清空原list，若立即自动清空，则在reload之后、请求回调之前页面是空白的 | Boolean | true | false |

Expand Down Expand Up @@ -176,12 +181,19 @@ setZPXConfig({

### events

| 事件名 | 说明 | 回调参数 |
| --------------- | ------------------------------------------------------------ | ------------------------------------------------------------ |
| @query | 下拉刷新或滚动到底部时会自动触发此方法。`z-paging-x`加载时也会触发(若要禁止，请设置`:auto="false"`)。pageNo和pageSize会自动计算好，直接传给服务器即可。 | `参数1`:pageNo(当前第几页)；<br/>`参数2`:pageSize(每页多少条)(pageSize必须与传给服务器的一致，如果需要修改pageSize，请通过`:default-page-size="15"`修改) |
| @refresh | 下拉刷新被触发 | - |
| @scroll | 列表滚动时触发 | `参数1`:(event: [ScrollEvent](https://doc.dcloud.net.cn/uni-app-x/component/list-view.html#scrollevent)) => void |
| @backToTopClick | 点击了返回到顶部 | 点击返回顶部按钮后是否滚动到顶部，默认为是。<br/>如果需要禁止滚动到顶部事件，则在page的methods中书写：<p style="font-weight:bold;">backToTopClick(e: (toTop: boolean) => void) {<br/> &nbsp;&nbsp;&nbsp;&nbsp;e(false);<br/> &nbsp;&nbsp;&nbsp;&nbsp;//处理自己的业务逻辑<br/>}</p> |
| 事件名 | 说明 | 回调参数 |
| ---------------------- | ------------------------------------------------------------ | ------------------------------------------------------------ |
| @query | 下拉刷新或滚动到底部时会自动触发此方法。`z-paging-x`加载时也会触发(若要禁止，请设置`:auto="false"`)。pageNo和pageSize会自动计算好，直接传给服务器即可。 | `参数1`:pageNo(当前第几页)；<br/>`参数2`:pageSize(每页多少条)(pageSize必须与传给服务器的一致，如果需要修改pageSize，请通过`:default-page-size="15"`修改) |
| @refresherpulling | 下拉刷新控件被下拉事件 | `参数1`:(event: [RefresherEvent](https://doc.dcloud.net.cn/uni-app-x/component/list-view.html#unirefresherevent) => void |
| @refresherrefresh | 下拉刷新被触发事件 | `参数1`:(event: [RefresherEvent](https://doc.dcloud.net.cn/uni-app-x/component/list-view.html#unirefresherevent) => void |
| @refresherrestore | 下拉刷新被复位事件 | `参数1`:(event: [RefresherEvent](https://doc.dcloud.net.cn/uni-app-x/component/list-view.html#unirefresherevent) => void |
| @refresherabort | 下拉刷新被中止事件 | `参数1`:(event: [RefresherEvent](https://doc.dcloud.net.cn/uni-app-x/component/list-view.html#unirefresherevent) => void |
| @scroll | 列表滚动时触发 | `参数1`:(event: [ScrollEvent](https://doc.dcloud.net.cn/uni-app-x/component/list-view.html#uniscrollevent)) => void |
| @scrolltolower | 滚动到底部/右边，会触发 scrolltolower 事件 | `参数1`:(event: [ScrollToLowerEvent](https://doc.dcloud.net.cn/uni-app-x/component/list-view.html#uniscrolltolowerevent)) => void |
| @scrolltoupper | 滚动到顶部/左边，会触发 scrolltoupper 事件 | `参数1`:(event: [ScrollToUpperEvent](https://doc.dcloud.net.cn/uni-app-x/component/list-view.html#uniscrolltoupperevent)) => void |
| @backToTopClick | 点击了返回到顶部 | 点击返回顶部按钮后是否滚动到顶部，默认为是。<br/>如果需要禁止滚动到顶部事件，则在page的methods中书写：<p style="font-weight:bold;">backToTopClick(e: (toTop: boolean) => void) {<br/> &nbsp;&nbsp;&nbsp;&nbsp;e(false);<br/> &nbsp;&nbsp;&nbsp;&nbsp;//处理自己的业务逻辑<br/>}</p> |
| @refresherStatusChange | 下拉刷新状态改变 | `参数1`:下拉刷新状态：0.默认状态 1.松手立即刷新 2.刷新中 3.刷新结束 |
| @loadMoreStatusChange | 底部加载更多状态改变 | `参数1`:底部加载更多状态：0.默认状态 1.加载中 2.没有更多数据 3.加载失败 |

### methods

Expand All @@ -192,9 +204,9 @@ setZPXConfig({
| completeByTotal | 【通过total判断是否有更多数据】请求成功调用此方法(将此方法替换`complete`方法即可，此方法为`complete`方法的功能扩展，遵循`complete`原有规则) | `参数1(必填)`:请求结果数组；`参数2(必填)`:列表总长度； |
| completeByNoMore | 【自行判断是否有更多数据】请求结束(成功或者失败)调用此方法，将请求的结果传递给z-paging-x处理(将此方法替换`complete`方法即可，此方法为`complete`方法的功能扩展，遵循`complete`原有规则) | `参数1(必填)`:请求结果数组；`参数2(必填)`:是否没有更多数据，若为true则代表没有更多数据了； |
| completeByError | 请求结束(失败)调用此方法，将自动展示失败页面 | - |
| scrollToTop | 滚动到顶部 | - |
| scrollToBottom | 滚动到底部 | - |
| scrollToY | 滚动到指定位置 | `参数1(必填)`:滚动到的位置 |
| scrollToTop | 滚动到顶部 | `参数1(必填)`:是否有动画效果 |
| scrollToBottom | 滚动到底部 | `参数1(必填)`:是否有动画效果 |
| scrollToY | 滚动到指定位置 | `参数1(必填)`:滚动到的位置；`参数2(必填)`:是否有动画效果 |


### slots
Expand Down

0 comments on commit c57185f

Please sign in to comment.