ht-components-taro-v3 1.0.5 → 1.0.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/README.md +5 -1
  2. package/dist/cjs/index.css +1 -1
  3. package/dist/cjs/index.js +32 -13
  4. package/dist/esm/index.css +1 -1
  5. package/dist/esm/index.js +32 -13
  6. package/package.json +1 -1
package/README.md CHANGED
@@ -1,3 +1,4 @@
1
+ h5使用esm，小程序使用cjs
1
2
 
2
3
  # HTScrollView
3
4
 
@@ -10,11 +11,14 @@
10
11
  | method | string | 请求方法，默认GET | 是 | 'GET' |
11
12
  | resListKey | string | 返回数据列表的key | 是 | - |
12
13
  | renderItemFn | function | 列表项渲染函数，函数参数为item和index | 是 | - |
13
- | className | string | 组件的自定义类名 | - | - |
14
+ | className | string | 组件内层View的自定义类名 | - | - |
15
+ | scrollClassName | string | 最外层scrollView的自定义类名 | - | - |
14
16
  | isShowNoMoreDataTips | boolean | 是否显示没有更多数据的提示，默认显示 | - | true |
15
17
  | noMoreDataTipsText | string | 没有更多数据的提示内容 | - | '没有更多数据了' |
16
18
  | ajaxData | object | 额外的请求参数 | - | {} |
17
19
  | limit | number | 每次请求的数据条数，默认10 | - | 10 |
18
20
  | dealReqDataFn | function | 请求回来的数据处理函数 | - | - |
19
21
  | onReqErrorFn | function | 请求失败回调函数 | - | - |
22
+ | renderEmptyFn | function | 无数据时的空状态渲染函数 | - | - |
23
+
20
24
 
package/dist/cjs/index.css CHANGED
@@ -1 +1 @@
1
- .ht-scroll-component-view{display:flex;flex-wrap:wrap;height:100%;width:100%}.ht-scroll-component-view .request-loading-view{align-items:center;color:#9a9b9c;display:flex;font-family:PingFangSC-Regular,PingFang SC;font-size:40px;font-weight:400;justify-content:center;width:100%}@keyframes rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ht-scroll-component-view .request-loading-view .request-loading-icon{animation:rotate 3s linear infinite;display:block;height:40px;margin-right:8px;width:40px}.ht-scroll-component-view .no-more-data-tip{color:#9a9b9c;font-family:PingFangSC-Regular,PingFang SC;font-size:40px;font-weight:400;line-height:58px;text-align:center;width:100%}
1
+ .ht-scroll-component-view{height:100%;width:100%}.ht-scroll-component-view .ht-scroll-component-inner{box-sizing:border-box;display:flex;flex-wrap:wrap;width:100%}.ht-scroll-component-view .ht-scroll-component-inner .blank-data-view{align-items:center;box-sizing:border-box;display:flex;flex-direction:column;padding:200px 0;text-align:center;width:100%}.ht-scroll-component-view .ht-scroll-component-inner .blank-data-view .blank-data-img{display:block;height:128px;margin-bottom:20px;width:128px}.ht-scroll-component-view .ht-scroll-component-inner .blank-data-view .blank-data-label{color:#424242;font-family:PingFangSC-Regular,PingFang SC;font-size:26px;font-weight:400}.ht-scroll-component-view .ht-scroll-component-inner .request-loading-view{align-items:center;color:#9a9b9c;display:flex;font-family:PingFangSC-Regular,PingFang SC;font-size:40px;font-weight:400;justify-content:center;width:100%}@keyframes rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ht-scroll-component-view .ht-scroll-component-inner .request-loading-view .request-loading-icon{animation:rotate 3s linear infinite;display:block;height:40px;margin-right:8px;width:40px}.ht-scroll-component-view .ht-scroll-component-inner .no-more-data-tip{color:#9a9b9c;font-family:PingFangSC-Regular,PingFang SC;font-size:40px;font-weight:400;line-height:58px;text-align:center;width:100%}
package/dist/cjs/index.js CHANGED
@@ -2413,7 +2413,8 @@ if (!TO_STRING_TAG_SUPPORT) {
2413
2413
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
2414
2414
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
2415
2415
 
2416
- // className 组件的自定义类名
2416
+ // className 组件内层View的自定义类名
2417
+ // scrollClassName 最外层scrollView的自定义类名
2417
2418
  // isShowNoMoreDataTips 是否显示没有更多数据的提示，默认显示
2418
2419
  // noMoreDataTipsText 没有更多提示的内容
2419
2420
  // ajaxFn 请求函数
@@ -2425,12 +2426,16 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
2425
2426
  // dealReqDataFn Fn 请求回来的数据处理函数
2426
2427
  // onReqErrorFn Fn 请求失败回调函数
2427
2428
  // renderItemFn Fn 列表项渲染函数，必传，函数参数为item和index
2429
+ // renderEmptyFn Fn 无数据时的空状态渲染函数
2428
2430
  var HTScrollView = function HTScrollView(props) {
2429
2431
  var className = props.className,
2432
+ scrollClassName = props.scrollClassName,
2433
+ renderItemFn = props.renderItemFn,
2434
+ renderEmptyFn = props.renderEmptyFn,
2430
2435
  _props$isShowNoMoreDa = props.isShowNoMoreDataTips,
2431
2436
  isShowNoMoreDataTips = _props$isShowNoMoreDa === void 0 ? true : _props$isShowNoMoreDa,
2432
2437
  _props$noMoreDataTips = props.noMoreDataTipsText,
2433
- noMoreDataTipsText = _props$noMoreDataTips === void 0 ? "没有更多数据了" : _props$noMoreDataTips;
2438
+ noMoreDataTipsText = _props$noMoreDataTips === void 0 ? '没有更多数据了' : _props$noMoreDataTips;
2434
2439
 
2435
2440
  // 是否正在请求
2436
2441
  var _useState = React.useState(true),
@@ -2444,8 +2449,7 @@ var HTScrollView = function HTScrollView(props) {
2444
2449
  setIsCompleteAllData = _useState4[1];
2445
2450
  // 分页数据
2446
2451
  var _useState5 = React.useState({
2447
- pageNum: 1,
2448
- total: 0
2452
+ pageNum: 1
2449
2453
  }),
2450
2454
  _useState6 = _slicedToArray(_useState5, 2),
2451
2455
  pageData = _useState6[0],
@@ -2480,19 +2484,20 @@ var HTScrollView = function HTScrollView(props) {
2480
2484
  var ajaxFn = props.ajaxFn,
2481
2485
  api = props.api,
2482
2486
  _props$method = props.method,
2483
- method = _props$method === void 0 ? "GET" : _props$method,
2487
+ method = _props$method === void 0 ? 'GET' : _props$method,
2484
2488
  _props$ajaxData = props.ajaxData,
2485
2489
  ajaxData = _props$ajaxData === void 0 ? {} : _props$ajaxData,
2486
2490
  _props$limit = props.limit,
2487
2491
  limit = _props$limit === void 0 ? 10 : _props$limit;
2488
2492
  var env = (_Taro$getEnv = Taro__default["default"].getEnv()) === null || _Taro$getEnv === void 0 ? void 0 : _Taro$getEnv.toLowerCase();
2489
- console.log("env", env);
2493
+ // console.log("env", env);
2494
+
2490
2495
  setIsRequesting(true);
2491
2496
  var ajaxParams = _objectSpread(_objectSpread({}, ajaxData), {}, {
2492
2497
  page: pageData.pageNum,
2493
2498
  limit: limit
2494
2499
  });
2495
- if (env === "web") {
2500
+ if (env === 'web') {
2496
2501
  ajaxFn({
2497
2502
  method: method,
2498
2503
  url: api,
@@ -2502,7 +2507,7 @@ var HTScrollView = function HTScrollView(props) {
2502
2507
  }).catch(function () {
2503
2508
  onAjaxError();
2504
2509
  });
2505
- } else if (env === "weapp") {
2510
+ } else if (env === 'weapp') {
2506
2511
  ajaxFn(method, api, ajaxParams).then(function (res) {
2507
2512
  dealAjaxData(res);
2508
2513
  }).catch(function (err) {
@@ -2527,7 +2532,7 @@ var HTScrollView = function HTScrollView(props) {
2527
2532
  setIsCompleteAllData(!newDataList.length);
2528
2533
  setIsRequesting(false);
2529
2534
  } else {
2530
- onAjaxError("ajax fail");
2535
+ onAjaxError(new Error('ajax fail'));
2531
2536
  }
2532
2537
  };
2533
2538
  // 请求失败时
@@ -2536,21 +2541,35 @@ var HTScrollView = function HTScrollView(props) {
2536
2541
  onReqErrorFn && onReqErrorFn(err);
2537
2542
  setIsRequesting(false);
2538
2543
  };
2544
+
2545
+ // 空状态的默认渲染界面
2546
+ var renderEmptyDefaultFn = function renderEmptyDefaultFn() {
2547
+ return /*#__PURE__*/React__default["default"].createElement(components.View, {
2548
+ className: "blank-data-view"
2549
+ }, /*#__PURE__*/React__default["default"].createElement(components.Image, {
2550
+ className: "blank-data-img",
2551
+ src: "https://xiaobangkj.oss-cn-hangzhou.aliyuncs.com/mini-question/h5/list-blank.png"
2552
+ }), /*#__PURE__*/React__default["default"].createElement(components.View, {
2553
+ className: "blank-data-label"
2554
+ }, "\u6682\u65E0\u6570\u636E"));
2555
+ };
2539
2556
  return /*#__PURE__*/React__default["default"].createElement(components.ScrollView, {
2540
- className: "ht-scroll-component-view ".concat(className || ""),
2557
+ className: "ht-scroll-component-view ".concat(scrollClassName || ''),
2541
2558
  scrollY: true,
2542
2559
  scrollWithAnimation: true,
2543
2560
  onScrollToLower: scrollToLower
2561
+ }, /*#__PURE__*/React__default["default"].createElement(components.View, {
2562
+ className: "ht-scroll-component-inner ".concat(className || '')
2544
2563
  }, dataList.map(function (item, index) {
2545
- return props.renderItemFn(item, index);
2546
- }), isRequesting && /*#__PURE__*/React__default["default"].createElement(components.View, {
2564
+ return renderItemFn(item, index);
2565
+ }), !isRequesting && !dataList.length ? renderEmptyFn ? renderEmptyFn() : renderEmptyDefaultFn() : '', isRequesting && /*#__PURE__*/React__default["default"].createElement(components.View, {
2547
2566
  className: "request-loading-view"
2548
2567
  }, /*#__PURE__*/React__default["default"].createElement(components.Image, {
2549
2568
  className: "request-loading-icon",
2550
2569
  src: "https://xiaobangkj.oss-cn-hangzhou.aliyuncs.com/mini-live/taroComponentsV3/scroll-bottom-loading-icon.png"
2551
2570
  }), "\u6B63\u5728\u52A0\u8F7D\u4E2D..."), isCompleteAllData && !!isShowNoMoreDataTips && /*#__PURE__*/React__default["default"].createElement(components.View, {
2552
2571
  className: "no-more-data-tip"
2553
- }, noMoreDataTipsText));
2572
+ }, noMoreDataTipsText)));
2554
2573
  };
2555
2574
 
2556
2575
  exports.HTScrollView = HTScrollView;
package/dist/esm/index.css CHANGED
@@ -1 +1 @@
1
- .ht-scroll-component-view{display:flex;flex-wrap:wrap;height:100%;width:100%}.ht-scroll-component-view .request-loading-view{align-items:center;color:#9a9b9c;display:flex;font-family:PingFangSC-Regular,PingFang SC;font-size:40px;font-weight:400;justify-content:center;width:100%}@keyframes rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ht-scroll-component-view .request-loading-view .request-loading-icon{animation:rotate 3s linear infinite;display:block;height:40px;margin-right:8px;width:40px}.ht-scroll-component-view .no-more-data-tip{color:#9a9b9c;font-family:PingFangSC-Regular,PingFang SC;font-size:40px;font-weight:400;line-height:58px;text-align:center;width:100%}
1
+ .ht-scroll-component-view{height:100%;width:100%}.ht-scroll-component-view .ht-scroll-component-inner{box-sizing:border-box;display:flex;flex-wrap:wrap;width:100%}.ht-scroll-component-view .ht-scroll-component-inner .blank-data-view{align-items:center;box-sizing:border-box;display:flex;flex-direction:column;padding:200px 0;text-align:center;width:100%}.ht-scroll-component-view .ht-scroll-component-inner .blank-data-view .blank-data-img{display:block;height:128px;margin-bottom:20px;width:128px}.ht-scroll-component-view .ht-scroll-component-inner .blank-data-view .blank-data-label{color:#424242;font-family:PingFangSC-Regular,PingFang SC;font-size:26px;font-weight:400}.ht-scroll-component-view .ht-scroll-component-inner .request-loading-view{align-items:center;color:#9a9b9c;display:flex;font-family:PingFangSC-Regular,PingFang SC;font-size:40px;font-weight:400;justify-content:center;width:100%}@keyframes rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.ht-scroll-component-view .ht-scroll-component-inner .request-loading-view .request-loading-icon{animation:rotate 3s linear infinite;display:block;height:40px;margin-right:8px;width:40px}.ht-scroll-component-view .ht-scroll-component-inner .no-more-data-tip{color:#9a9b9c;font-family:PingFangSC-Regular,PingFang SC;font-size:40px;font-weight:400;line-height:58px;text-align:center;width:100%}
package/dist/esm/index.js CHANGED
@@ -2404,7 +2404,8 @@ if (!TO_STRING_TAG_SUPPORT) {
2404
2404
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
2405
2405
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
2406
2406
 
2407
- // className 组件的自定义类名
2407
+ // className 组件内层View的自定义类名
2408
+ // scrollClassName 最外层scrollView的自定义类名
2408
2409
  // isShowNoMoreDataTips 是否显示没有更多数据的提示，默认显示
2409
2410
  // noMoreDataTipsText 没有更多提示的内容
2410
2411
  // ajaxFn 请求函数
@@ -2416,12 +2417,16 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
2416
2417
  // dealReqDataFn Fn 请求回来的数据处理函数
2417
2418
  // onReqErrorFn Fn 请求失败回调函数
2418
2419
  // renderItemFn Fn 列表项渲染函数，必传，函数参数为item和index
2420
+ // renderEmptyFn Fn 无数据时的空状态渲染函数
2419
2421
  var HTScrollView = function HTScrollView(props) {
2420
2422
  var className = props.className,
2423
+ scrollClassName = props.scrollClassName,
2424
+ renderItemFn = props.renderItemFn,
2425
+ renderEmptyFn = props.renderEmptyFn,
2421
2426
  _props$isShowNoMoreDa = props.isShowNoMoreDataTips,
2422
2427
  isShowNoMoreDataTips = _props$isShowNoMoreDa === void 0 ? true : _props$isShowNoMoreDa,
2423
2428
  _props$noMoreDataTips = props.noMoreDataTipsText,
2424
- noMoreDataTipsText = _props$noMoreDataTips === void 0 ? "没有更多数据了" : _props$noMoreDataTips;
2429
+ noMoreDataTipsText = _props$noMoreDataTips === void 0 ? '没有更多数据了' : _props$noMoreDataTips;
2425
2430
 
2426
2431
  // 是否正在请求
2427
2432
  var _useState = useState(true),
@@ -2435,8 +2440,7 @@ var HTScrollView = function HTScrollView(props) {
2435
2440
  setIsCompleteAllData = _useState4[1];
2436
2441
  // 分页数据
2437
2442
  var _useState5 = useState({
2438
- pageNum: 1,
2439
- total: 0
2443
+ pageNum: 1
2440
2444
  }),
2441
2445
  _useState6 = _slicedToArray(_useState5, 2),
2442
2446
  pageData = _useState6[0],
@@ -2471,19 +2475,20 @@ var HTScrollView = function HTScrollView(props) {
2471
2475
  var ajaxFn = props.ajaxFn,
2472
2476
  api = props.api,
2473
2477
  _props$method = props.method,
2474
- method = _props$method === void 0 ? "GET" : _props$method,
2478
+ method = _props$method === void 0 ? 'GET' : _props$method,
2475
2479
  _props$ajaxData = props.ajaxData,
2476
2480
  ajaxData = _props$ajaxData === void 0 ? {} : _props$ajaxData,
2477
2481
  _props$limit = props.limit,
2478
2482
  limit = _props$limit === void 0 ? 10 : _props$limit;
2479
2483
  var env = (_Taro$getEnv = Taro.getEnv()) === null || _Taro$getEnv === void 0 ? void 0 : _Taro$getEnv.toLowerCase();
2480
- console.log("env", env);
2484
+ // console.log("env", env);
2485
+
2481
2486
  setIsRequesting(true);
2482
2487
  var ajaxParams = _objectSpread(_objectSpread({}, ajaxData), {}, {
2483
2488
  page: pageData.pageNum,
2484
2489
  limit: limit
2485
2490
  });
2486
- if (env === "web") {
2491
+ if (env === 'web') {
2487
2492
  ajaxFn({
2488
2493
  method: method,
2489
2494
  url: api,
@@ -2493,7 +2498,7 @@ var HTScrollView = function HTScrollView(props) {
2493
2498
  }).catch(function () {
2494
2499
  onAjaxError();
2495
2500
  });
2496
- } else if (env === "weapp") {
2501
+ } else if (env === 'weapp') {
2497
2502
  ajaxFn(method, api, ajaxParams).then(function (res) {
2498
2503
  dealAjaxData(res);
2499
2504
  }).catch(function (err) {
@@ -2518,7 +2523,7 @@ var HTScrollView = function HTScrollView(props) {
2518
2523
  setIsCompleteAllData(!newDataList.length);
2519
2524
  setIsRequesting(false);
2520
2525
  } else {
2521
- onAjaxError("ajax fail");
2526
+ onAjaxError(new Error('ajax fail'));
2522
2527
  }
2523
2528
  };
2524
2529
  // 请求失败时
@@ -2527,21 +2532,35 @@ var HTScrollView = function HTScrollView(props) {
2527
2532
  onReqErrorFn && onReqErrorFn(err);
2528
2533
  setIsRequesting(false);
2529
2534
  };
2535
+
2536
+ // 空状态的默认渲染界面
2537
+ var renderEmptyDefaultFn = function renderEmptyDefaultFn() {
2538
+ return /*#__PURE__*/React.createElement(View, {
2539
+ className: "blank-data-view"
2540
+ }, /*#__PURE__*/React.createElement(Image, {
2541
+ className: "blank-data-img",
2542
+ src: "https://xiaobangkj.oss-cn-hangzhou.aliyuncs.com/mini-question/h5/list-blank.png"
2543
+ }), /*#__PURE__*/React.createElement(View, {
2544
+ className: "blank-data-label"
2545
+ }, "\u6682\u65E0\u6570\u636E"));
2546
+ };
2530
2547
  return /*#__PURE__*/React.createElement(ScrollView, {
2531
- className: "ht-scroll-component-view ".concat(className || ""),
2548
+ className: "ht-scroll-component-view ".concat(scrollClassName || ''),
2532
2549
  scrollY: true,
2533
2550
  scrollWithAnimation: true,
2534
2551
  onScrollToLower: scrollToLower
2552
+ }, /*#__PURE__*/React.createElement(View, {
2553
+ className: "ht-scroll-component-inner ".concat(className || '')
2535
2554
  }, dataList.map(function (item, index) {
2536
- return props.renderItemFn(item, index);
2537
- }), isRequesting && /*#__PURE__*/React.createElement(View, {
2555
+ return renderItemFn(item, index);
2556
+ }), !isRequesting && !dataList.length ? renderEmptyFn ? renderEmptyFn() : renderEmptyDefaultFn() : '', isRequesting && /*#__PURE__*/React.createElement(View, {
2538
2557
  className: "request-loading-view"
2539
2558
  }, /*#__PURE__*/React.createElement(Image, {
2540
2559
  className: "request-loading-icon",
2541
2560
  src: "https://xiaobangkj.oss-cn-hangzhou.aliyuncs.com/mini-live/taroComponentsV3/scroll-bottom-loading-icon.png"
2542
2561
  }), "\u6B63\u5728\u52A0\u8F7D\u4E2D..."), isCompleteAllData && !!isShowNoMoreDataTips && /*#__PURE__*/React.createElement(View, {
2543
2562
  className: "no-more-data-tip"
2544
- }, noMoreDataTipsText));
2563
+ }, noMoreDataTipsText)));
2545
2564
  };
2546
2565
 
2547
2566
  export { HTScrollView };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ht-components-taro-v3",
3
- "version": "1.0.5",
3
+ "version": "1.0.7",
4
4
  "description": "基于 Rollup 构建的 Taro 多端组件库",
5
5
  "main": "dist/cjs/index.js",
6
6
  "module": "dist/esm/index.js",