| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354 |
- declare interface BreakPointTypeOption<T> {
- xs?: T
- sm?: T
- md?: T
- lg?: T
- }
- export class BreakPointType<T> {
- options: BreakPointTypeOption<T>
- constructor(option: BreakPointTypeOption<T>) {
- this.options = option
- }
- getValue(currentBreakPoint: string) {
- if (currentBreakPoint === 'xs') {
- return this.options.xs
- } else if (currentBreakPoint === 'sm') {
- return this.options.sm
- } else if (currentBreakPoint === 'md') {
- return this.options.md
- } else if (currentBreakPoint === 'lg') {
- return this.options.lg
- } else {
- return undefined
- }
- }
- }
- class YTBreakPoint {
- readonly KEY = 'bp'
- setBreakPoint(width: number) {
- const vpWidth = px2vp(width)
- let bp = ''
- if (vpWidth < 320) {
- bp = 'xs'
- } else if (vpWidth < 600) {
- bp = 'sm'
- } else if (vpWidth < 840) {
- bp = 'md'
- } else {
- bp = 'lg'
- }
- AppStorage.setOrCreate<string>(this.KEY, bp)
- }
- getBreakPoint() {
- return AppStorage.get<string>(this.KEY)
- }
- }
- export const yTBreakPoint = new YTBreakPoint()
|