@gizwits/vantui/es/grid/index.js

机智云组件库

import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
var _excluded = ["gutter", "clickable", "columnNum", "center", "border", "direction", "iconSize", "square", "reverse", "className", "style"];
import { View } from '@tarojs/components';
import { cloneElement, useCallback, useMemo, useRef, useEffect } from 'react';
import * as utils from '../wxs/utils';
import * as computed from './wxs';
import { jsx as _jsx } from "react/jsx-runtime";
export function Grid(props) {
  var _props$gutter = props.gutter,
    gutter = _props$gutter === void 0 ? null : _props$gutter,
    clickable = props.clickable,
    _props$columnNum = props.columnNum,
    columnNum = _props$columnNum === void 0 ? 4 : _props$columnNum,
    _props$center = props.center,
    center = _props$center === void 0 ? true : _props$center,
    _props$border = props.border,
    border = _props$border === void 0 ? true : _props$border,
    direction = props.direction,
    _props$iconSize = props.iconSize,
    iconSize = _props$iconSize === void 0 ? '48' : _props$iconSize,
    square = props.square,
    _props$reverse = props.reverse,
    reverse = _props$reverse === void 0 ? false : _props$reverse,
    _props$className = props.className,
    className = _props$className === void 0 ? '' : _props$className,
    _props$style = props.style,
    style = _props$style === void 0 ? {} : _props$style,
    others = _objectWithoutProperties(props, _excluded);
  var childrenInstance = useRef([]);
  var updateChildren = useCallback(function () {
    childrenInstance.current.forEach(function (child) {
      child.updateStyle();
    });
  }, []);
  useEffect(function () {
    updateChildren();
  }, [updateChildren]);
  var setChildrenInstance = useCallback(function (index, instance) {
    childrenInstance.current[index] = instance;
  }, []);
  var ResetChildren = useMemo(function () {
    var res = [];
    if (others.children && Array.isArray(others.children)) {
      others.children.forEach(function (child, index) {
        res.push( /*#__PURE__*/cloneElement(child, {
          setChildrenInstance: setChildrenInstance,
          key: index,
          index: index,
          parentInstance: {
            columnNum: columnNum,
            border: border,
            square: square,
            gutter: gutter,
            clickable: clickable,
            center: center,
            direction: direction,
            reverse: reverse,
            iconSize: iconSize
          }
        }));
      });
    }
    return res;
  },
  // eslint-disable-next-line react-hooks/exhaustive-deps
  [others.children, columnNum]);
  return /*#__PURE__*/_jsx(View, {
    className: 'van-grid  ' + (border && !gutter ? 'van-hairline--top' : '') + ' ' + className,
    style: utils.style([computed.rootStyle({
      gutter: gutter
    }), style]),
    children: ResetChildren
  });
}
export default Grid;