@antmjs/vantui/lib/infinite-scroll/demo/demo1.js

一套适用于Taro3及React的vantui组件库

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = Demo;
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _react = _interopRequireDefault(require("react"));
var _components = require("@tarojs/components");
var _vantui = require("@antmjs/vantui");
var _common = require("./common");
var _jsxRuntime = require("react/jsx-runtime");
/* eslint-disable */

function Demo() {
  var _react$useState = _react.default.useState([]),
    _react$useState2 = (0, _slicedToArray2.default)(_react$useState, 2),
    data = _react$useState2[0],
    setdata = _react$useState2[1];
  var InfiniteScrollInstance = _react.default.useRef();
  var loadMore = /*#__PURE__*/function () {
    var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
      return _regenerator.default.wrap(function _callee2$(_context2) {
        while (1) switch (_context2.prev = _context2.next) {
          case 0:
            return _context2.abrupt("return", new Promise( /*#__PURE__*/function () {
              var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(resolve) {
                var reslult, newData;
                return _regenerator.default.wrap(function _callee$(_context) {
                  while (1) switch (_context.prev = _context.next) {
                    case 0:
                      _context.next = 2;
                      return (0, _common.mockGoods)();
                    case 2:
                      reslult = _context.sent;
                      newData = data.concat(reslult);
                      setdata(newData);
                      // 以下是简单的模拟请求，正常请求请按条件执行`resolve('complete')`
                      // 设定一页10条数据,小于10则没有更多数据
                      resolve(reslult.length < 10 ? 'complete' : 'loading');
                    case 6:
                    case "end":
                      return _context.stop();
                  }
                }, _callee);
              }));
              return function (_x) {
                return _ref2.apply(this, arguments);
              };
            }()));
          case 1:
          case "end":
            return _context2.stop();
        }
      }, _callee2);
    }));
    return function loadMore() {
      return _ref.apply(this, arguments);
    };
  }();
  var onRefresh = function onRefresh() {
    return new Promise( /*#__PURE__*/function () {
      var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3(resolve) {
        var _InfiniteScrollInstan;
        var reslult;
        return _regenerator.default.wrap(function _callee3$(_context3) {
          while (1) switch (_context3.prev = _context3.next) {
            case 0:
              _context3.next = 2;
              return (0, _common.mockGoods)();
            case 2:
              reslult = _context3.sent;
              setdata(reslult);
              if (data.length > 8) (_InfiniteScrollInstan = InfiniteScrollInstance.current) === null || _InfiniteScrollInstan === void 0 ? void 0 : _InfiniteScrollInstan.reset();
              resolve(undefined);
            case 6:
            case "end":
              return _context3.stop();
          }
        }, _callee3);
      }));
      return function (_x2) {
        return _ref3.apply(this, arguments);
      };
    }());
  };
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_vantui.PullToRefresh, {
    onRefresh: onRefresh,
    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.View, {
      style: {
        padding: '4px 6px'
      },
      children: [data.map(function (item, index) {
        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.View, {
          className: "van-demo-goods-item-wrapper",
          children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.View, {
            className: "van-demo-goods-item",
            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Image, {
              src: item.image,
              className: "img"
            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.View, {
              className: "title",
              children: item.title
            }), item.isCutPrice && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Text, {
              className: "cutPrice",
              children: "\u6700\u8FD1\u5927\u964D\u4EF7"
            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.View, {
              className: "price",
              children: item.price
            })]
          })
        }, "van-demo-goods-item-wrapper-infinite".concat(index));
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_vantui.InfiniteScroll, {
        loadMore: loadMore,
        ref: InfiniteScrollInstance
      })]
    })
  });
}