feat: 添加设备检测功能
This commit is contained in:
35
src/hooks/useDevice.js
Normal file
35
src/hooks/useDevice.js
Normal file
@@ -0,0 +1,35 @@
|
||||
/**
|
||||
* useDevice Hook
|
||||
*
|
||||
* 封装设备类型检测,提供简洁的 API 供组件使用
|
||||
*
|
||||
* @example
|
||||
* const { isMobile, isTablet, isDesktop, deviceType } = useDevice();
|
||||
*
|
||||
* if (isMobile) return <MobileView />;
|
||||
* if (isTablet) return <TabletView />;
|
||||
* return <DesktopView />;
|
||||
*/
|
||||
import { useSelector } from 'react-redux';
|
||||
import {
|
||||
selectIsMobile,
|
||||
selectIsTablet,
|
||||
selectIsDesktop,
|
||||
selectDeviceType,
|
||||
} from '@/store/slices/deviceSlice';
|
||||
|
||||
export const useDevice = () => {
|
||||
const isMobile = useSelector(selectIsMobile);
|
||||
const isTablet = useSelector(selectIsTablet);
|
||||
const isDesktop = useSelector(selectIsDesktop);
|
||||
const deviceType = useSelector(selectDeviceType);
|
||||
|
||||
return {
|
||||
isMobile,
|
||||
isTablet,
|
||||
isDesktop,
|
||||
deviceType,
|
||||
};
|
||||
};
|
||||
|
||||
export default useDevice;
|
||||
Reference in New Issue
Block a user