react-media-saisai
Version:
兼容TS和JS的一个自适应浏览器缩放的插件
119 lines (112 loc) • 3.61 kB
JavaScript
;
var React = require('react');
function _iterableToArrayLimit(r, l) {
var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
if (null != t) {
var e,
n,
i,
u,
a = [],
f = !0,
o = !1;
try {
if (i = (t = t.call(r)).next, 0 === l) {
if (Object(t) !== t) return;
f = !1;
} else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0);
} catch (r) {
o = !0, n = r;
} finally {
try {
if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return;
} finally {
if (o) throw n;
}
}
return a;
}
}
function _slicedToArray(arr, i) {
return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
}
function _arrayWithHoles(arr) {
if (Array.isArray(arr)) return arr;
}
function _unsupportedIterableToArray(o, minLen) {
if (!o) return;
if (typeof o === "string") return _arrayLikeToArray(o, minLen);
var n = Object.prototype.toString.call(o).slice(8, -1);
if (n === "Object" && o.constructor) n = o.constructor.name;
if (n === "Map" || n === "Set") return Array.from(o);
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
}
function _arrayLikeToArray(arr, len) {
if (len == null || len > arr.length) len = arr.length;
for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
return arr2;
}
function _nonIterableRest() {
throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}
function styleInject(css, ref) {
if (ref === void 0) ref = {};
var insertAt = ref.insertAt;
if (!css || typeof document === 'undefined') {
return;
}
var head = document.head || document.getElementsByTagName('head')[0];
var style = document.createElement('style');
style.type = 'text/css';
if (insertAt === 'top') {
if (head.firstChild) {
head.insertBefore(style, head.firstChild);
} else {
head.appendChild(style);
}
} else {
head.appendChild(style);
}
if (style.styleSheet) {
style.styleSheet.cssText = css;
} else {
style.appendChild(document.createTextNode(css));
}
}
var css_248z = ".custom-adapter {\r\n height: 100%;\r\n width: 100%;\r\n}";
styleInject(css_248z);
var TableComponent = function TableComponent(props) {
var _useState = React.useState(1),
_useState2 = _slicedToArray(_useState, 2),
zoom = _useState2[0],
setZoom = _useState2[1];
var calculateZoom = function calculateZoom() {
var explorer = window.navigator.userAgent;
if (explorer.indexOf("Firefox") >= 0) {
console.log("火狐浏览器处理");
} else if (explorer.indexOf("Chrome") >= 0 || explorer.indexOf("Safari") >= 0) {
// 谷歌、苹果浏览器
if (document.body.clientWidth < 1536) {
setZoom(document.body.clientWidth / 1536);
} else if (document.body.clientWidth >= 2100) {
setZoom(document.body.clientWidth / 2100);
} else {
setZoom(1);
}
}
};
React.useEffect(function () {
console.log('当前npm包进来了');
calculateZoom();
window.onresize = function () {
calculateZoom();
};
}, []);
return /*#__PURE__*/React.createElement("div", {
className: "custom-adapter",
style: {
zoom: zoom
}
}, props.children);
};
exports.TableComponent = TableComponent;