From 0a24ffeb3eff074c8f11e9f94fdf2c2cb4929799 Mon Sep 17 00:00:00 2001 From: quanyawei <401863037@qq.com> Date: Fri, 10 Nov 2023 13:08:29 +0800 Subject: [PATCH] fix:小程序详情修改 --- uni_modules/uview-ui/components/u-list/u-list.vue | 157 ++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 157 insertions(+), 0 deletions(-) diff --git a/uni_modules/uview-ui/components/u-list/u-list.vue b/uni_modules/uview-ui/components/u-list/u-list.vue new file mode 100644 index 0000000..4447cab --- /dev/null +++ b/uni_modules/uview-ui/components/u-list/u-list.vue @@ -0,0 +1,157 @@ +<template> + <!-- #ifdef APP-NVUE --> + <list + class="u-list" + :enableBackToTop="enableBackToTop" + :loadmoreoffset="lowerThreshold" + :showScrollbar="showScrollbar" + :style="[listStyle]" + :offset-accuracy="Number(offsetAccuracy)" + @scroll="onScroll" + @loadmore="scrolltolower" + > + <slot /> + </list> + <!-- #endif --> + <!-- #ifndef APP-NVUE --> + <scroll-view + class="u-list" + :scroll-into-view="scrollIntoView" + :style="[listStyle]" + scroll-y + :scroll-top="Number(scrollTop)" + :lower-threshold="Number(lowerThreshold)" + :upper-threshold="Number(upperThreshold)" + :show-scrollbar="showScrollbar" + :enable-back-to-top="enableBackToTop" + :scroll-with-animation="scrollWithAnimation" + @scroll="onScroll" + @scrolltolower="scrolltolower" + @scrolltoupper="scrolltoupper" + > + <view> + <slot /> + </view> + </scroll-view> + <!-- #endif --> +</template> + +<script> + import props from './props.js'; + // #ifdef APP-NVUE + const dom = uni.requireNativePlugin('dom') + // #endif + /** + * List ������ + * @description ��������������������������������� + * @tutorial https://www.uviewui.com/components/list.html + * @property {Boolean} showScrollbar ���������������������������������nvue������ ��������� false ��� + * @property {String ��� Number} lowerThreshold ������������������������scrolltolower������ ��������� 50 ��� + * @property {String ��� Number} upperThreshold ������������������������scrolltoupper������������nvue������ ��������� 0 ��� + * @property {String ��� Number} scrollTop ������������������������������������ 0 ��� + * @property {String ��� Number} offsetAccuracy ������ onscroll ���������������������������nvue��������������� 10 ��� + * @property {Boolean} enableFlex ������ flexbox ������������������������������������������display: flex������������flex container������������������������������������������������������������������ false ��� + * @property {Boolean} pagingEnabled ���������������������������List������������ false ��� + * @property {Boolean} scrollable ������������List��������������� true ��� + * @property {String} scrollIntoView ���������������������id���id������������������������ + * @property {Boolean} scrollWithAnimation ��������������������������������������������� ��������� false ��� + * @property {Boolean} enableBackToTop iOS������������������������������������������������������������������������������������������������������ ��������� false ��� + * @property {String ��� Number} height ��������������� ��������� 0 ��� + * @property {String ��� Number} width ������������ ��������� 0 ��� + * @property {String ��� Number} preLoadScreen ���������������������������������1������������������������������1.5������1������������������ ��������� 1 ��� + * @property {Object} customStyle ��������������������������������� + * + * @example <u-list @scrolltolower="scrolltolower"></u-list> + */ + export default { + name: 'u-list', + mixins: [uni.$u.mpMixin, uni.$u.mixin,props], + watch: { + scrollIntoView(n) { + this.scrollIntoViewById(n) + } + }, + data() { + return { + // ��������������������������� + innerScrollTop: 0, + // vue������scroll-view������������������������������ + offset: 0, + sys: uni.$u.sys() + } + }, + computed: { + listStyle() { + const style = {}, + addUnit = uni.$u.addUnit + if (this.width != 0) style.width = addUnit(this.width) + if (this.height != 0) style.height = addUnit(this.height) + // ������������������������������������������������������������ + if (!style.height) style.height = addUnit(this.sys.windowHeight, 'px') + return uni.$u.deepMerge(style, uni.$u.addStyle(this.customStyle)) + } + }, + provide() { + return { + uList: this + } + }, + created() { + this.refs = [] + this.children = [] + this.anchors = [] + }, + mounted() {}, + methods: { + updateOffsetFromChild(top) { + this.offset = top + }, + onScroll(e) { + let scrollTop = 0 + // #ifdef APP-NVUE + scrollTop = e.contentOffset.y + // #endif + // #ifndef APP-NVUE + scrollTop = e.detail.scrollTop + // #endif + this.innerScrollTop = scrollTop + this.$emit('scroll', Math.abs(scrollTop)) + }, + scrollIntoViewById(id) { + // #ifdef APP-NVUE + // ������id���������������������u-list-item������������������������������dom������������������������������ + const item = this.refs.find(item => item.$refs[id] ? true : false) + dom.scrollToElement(item.$refs[id], { + // ������������������������ + animated: this.scrollWithAnimation + }) + // #endif + }, + // ��������������������������� + scrolltolower(e) { + uni.$u.sleep(30).then(() => { + this.$emit('scrolltolower') + }) + }, + // #ifndef APP-NVUE + // ������������������������������nvue������ + scrolltoupper(e) { + uni.$u.sleep(30).then(() => { + this.$emit('scrolltoupper') + // ���������������������������������������������������������webview��������������������������������������������������������� + this.offset = 0 + }) + } + // #endif + }, + } +</script> + +<style lang="scss" scoped> + @import "../../libs/css/components.scss"; + + .u-list { + @include flex(column); + + } +</style> -- Gitblit v1.8.0