@td-design/rn-hooks
Version:
从ahooks里面抽取的一些在rn项目里可以使用的hooks。提高开发效率
47 lines (44 loc) • 1.72 kB
JavaScript
import { __read } from '../_virtual/_tslib.js';
import { useEffect } from 'react';
import { Dimensions } from 'react-native';
import useDimensions from '../useDimensions/index.js';
import useSafeState from '../useSafeState/index.js';
var isOrientationPortrait = function (_a) {
var width = _a.width, height = _a.height;
return height >= width;
};
var isOrientationLandscape = function (_a) {
var width = _a.width, height = _a.height;
return width >= height;
};
function useDeviceOrientation() {
var screen = useDimensions().screen;
var initialState = {
portrait: isOrientationPortrait(screen),
landscape: isOrientationLandscape(screen),
};
var _a = __read(useSafeState(initialState), 2), orientation = _a[0], setOrientation = _a[1];
useEffect(function () {
var onChange = function (_a) {
var screen = _a.screen;
setOrientation({
portrait: isOrientationPortrait(screen),
landscape: isOrientationLandscape(screen),
});
};
var subscription = Dimensions.addEventListener('change', onChange);
return function () {
// @ts-ignore - React Native >= 0.65
if (typeof (subscription === null || subscription === void 0 ? void 0 : subscription.remove) === 'function') {
// @ts-ignore - need update @types/react-native@0.65.x
subscription.remove();
}
else {
// @ts-ignore React Native < 0.65
Dimensions.removeEventListener('change', onChange);
}
};
}, [setOrientation]);
return orientation;
}
export { useDeviceOrientation as default };