diff --git a/components/mescroll-uni/components/mescroll-up.css b/components/mescroll-uni/components/mescroll-up.css index cbf48cd..dfe6b31 100644 --- a/components/mescroll-uni/components/mescroll-up.css +++ b/components/mescroll-uni/components/mescroll-up.css @@ -6,6 +6,14 @@ text-align: center; clear: both; } +.mescroll-upwarp-zero { + box-sizing: border-box; + min-height: 300rpx; + padding: 30rpx 0; + text-align: center; + clear: both; +} + /*提示文本 */ .mescroll-upwarp .upwarp-tip, @@ -15,6 +23,12 @@ vertical-align: middle; /* color: gray; 已在style设置color,此处删去*/ } +.mescroll-upwarp .upwarp-prompt { + display: inline-block; + font-size: 28rpx; + vertical-align: middle; + /* color: gray; 已在style设置color,此处删去*/ +} .mescroll-upwarp .upwarp-tip { margin-left: 16rpx; diff --git a/components/mescroll-uni/mescroll-body.vue b/components/mescroll-uni/mescroll-body.vue index 687d1bc..0c53928 100644 --- a/components/mescroll-uni/mescroll-body.vue +++ b/components/mescroll-uni/mescroll-body.vue @@ -33,7 +33,7 @@ - + @@ -41,6 +41,7 @@ {{ mescroll.optUp.textNoMore }} + {{ mescroll.optUp.textUpText }} @@ -84,6 +85,8 @@ import MeScroll from './mescroll-uni.js'; // 引入全局配置 import GlobalOption from './mescroll-uni-option.js'; + // 引入 搜索 全局配置 + import GlobalSearchOption from './mescroll-uni-option-search.js'; // 引入空布局组件 import MescrollEmpty from './components/mescroll-empty.vue'; // 引入回到顶部组件 @@ -119,6 +122,10 @@ bottom: [String, Number], // 上拉布局往上的偏移量 (支持20, "20rpx", "20px", "20%"格式的值, 其中纯数字则默认单位rpx, 百分比则相对于windowHeight) safearea: Boolean, // bottom的偏移量是否加上底部安全区的距离, 默认false (需要适配iPhoneX时使用) height: [String, Number], // 指定mescroll最小高度,默认windowHeight,使列表不满屏仍可下拉 + customType: { + type: [String, Number], + default: 0 + }, // 自定义全局参数 bottombar:{ // 底部是否偏移TabBar的高度(默认仅在H5端的tab页生效) type: Boolean, default: true @@ -281,8 +288,11 @@ } } }; - - MeScroll.extend(diyOption, GlobalOption); // 混入全局的配置 + if (Number(this.customType) === 1) { + MeScroll.extend(diyOption, GlobalSearchOption); // 混入搜索全局的配置 + } else { + MeScroll.extend(diyOption, GlobalOption); // 混入全局的配置 + } let myOption = JSON.parse(JSON.stringify({down: vm.down,up: vm.up})); // 深拷贝,避免对props的影响 MeScroll.extend(myOption, diyOption); // 混入具体界面的配置 diff --git a/components/mescroll-uni/mescroll-uni-option-search.js b/components/mescroll-uni/mescroll-uni-option-search.js new file mode 100644 index 0000000..ac50d55 --- /dev/null +++ b/components/mescroll-uni/mescroll-uni-option-search.js @@ -0,0 +1,38 @@ +// 全局配置 +// mescroll-body 和 mescroll-uni 通用 +const GlobalOption = { + down: { + // 其他down的配置参数也可以写,这里只展示了常用的配置: + textInOffset: '下拉刷新', // 下拉的距离在offset范围内的提示文本 + textOutOffset: '释放更新', // 下拉的距离大于offset范围的提示文本 + textLoading: '加载中 ...', // 加载中的提示文本 + textSuccess: '加载成功', // 加载成功的文本 + textErr: '加载失败', // 加载失败的文本 + beforeEndDelay: 100, // 延时结束的时长 (显示加载成功/失败的时长) + offset: 80, // 在列表顶部,下拉大于80px,松手即可触发下拉刷新的回调 + native: false // 是否使用系统自带的下拉刷新; 默认false; 仅在mescroll-body生效 (值为true时,还需在pages配置enablePullDownRefresh:true;详请参考mescroll-native的案例) + }, + up: { + // 其他up的配置参数也可以写,这里只展示了常用的配置: + textLoading: '加载中 ...', // 加载中的提示文本 + textNoMore: '已经加载全部', // 没有更多数据的提示文本 + textUpText: '向上滑动 加载更多', // 没有更多数据的提示文本 + offset: 150, // 距底部多远时,触发upCallback,仅mescroll-uni生效 ( mescroll-body配置的是pages.json的 onReachBottomDistance ) + toTop: { + // 回到顶部按钮,需配置src才显示 + src: "https://www.mescroll.com/img/mescroll-totop.png", // 图片路径 (建议放入static目录, 如 /static/img/mescroll-totop.png ) + offset: 1000, // 列表滚动多少距离才显示回到顶部按钮,默认1000px + right: 20, // 到右边的距离, 默认20 (支持"20rpx", "20px", "20%"格式的值, 纯数字则默认单位rpx) + bottom: 120, // 到底部的距离, 默认120 (支持"20rpx", "20px", "20%"格式的值, 纯数字则默认单位rpx) + width: 72 // 回到顶部图标的宽度, 默认72 (支持"20rpx", "20px", "20%"格式的值, 纯数字则默认单位rpx) + }, + empty: { + use: true, // 是否显示空布局 + // icon: "https://www.mescroll.com/img/mescroll-empty.png", // 图标路径 (建议放入static目录, 如 /static/img/mescroll-empty.png ) + icon: '/static/empty1.png', + tip: '搜索不到关键字结果' // 提示 + } + } +} + +export default GlobalOption diff --git a/components/mescroll-uni/mescroll-uni-option.js b/components/mescroll-uni/mescroll-uni-option.js index f30c6d3..8a12b79 100644 --- a/components/mescroll-uni/mescroll-uni-option.js +++ b/components/mescroll-uni/mescroll-uni-option.js @@ -16,6 +16,7 @@ const GlobalOption = { // 其他up的配置参数也可以写,这里只展示了常用的配置: textLoading: '加载中 ...', // 加载中的提示文本 textNoMore: '亲, 没有更多了', // 没有更多数据的提示文本 + textUpText: '向上滑动 加载更多', // 没有更多数据的提示文本 offset: 150, // 距底部多远时,触发upCallback,仅mescroll-uni生效 ( mescroll-body配置的是pages.json的 onReachBottomDistance ) toTop: { // 回到顶部按钮,需配置src才显示 diff --git a/pages/search/index.vue b/pages/search/index.vue index 292ed2d..68bb546 100644 --- a/pages/search/index.vue +++ b/pages/search/index.vue @@ -1,5 +1,5 @@