| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960 |
- import { BreakPointString } from '../models'
- interface BreakPointTypeOption<T> {
- xs?: T
- sm?: T
- md?: T
- lg?: T
- }
- export class BreakPointType<T> {
- private readonly options: BreakPointTypeOption<T>
- constructor(option: BreakPointTypeOption<T>) {
- this.options = option
- }
- getValue(currentBreakPoint: BreakPointString) {
- switch (currentBreakPoint) {
- case 'xs':
- return this.options.xs;
- case 'sm':
- return this.options.sm;
- case 'md':
- return this.options.md;
- case 'lg':
- return this.options.lg;
- default:
- return undefined;
- }
- }
- }
- export class YTBreakPoint {
- /**
- * @type BreakPointString
- * @description 断点KEY值 使用BreakPointString类型代替string,限制非法输入
- */
- static readonly KEY = 'bp'
- static setBreakPoint(width: number) {
- const vpWidth = px2vp(width)
- let bp: BreakPointString = 'xs'
- if (vpWidth < 320) {
- bp = 'xs'
- } else if (vpWidth < 600) {
- bp = 'sm'
- } else if (vpWidth < 840) {
- bp = 'md'
- } else {
- bp = 'lg'
- }
- AppStorage.setOrCreate<BreakPointString>(YTBreakPoint.KEY, bp)
- }
- static getBreakPoint() {
- return AppStorage.get<string>(YTBreakPoint.KEY)
- }
- }
|