1# 媒体查询 2 3 4>  **说明：** 5> 6> - 从API Version 7 开始，该接口不再维护，推荐使用新接口[`@ohos.mediaquery`](js-apis-mediaquery.md)。 7> - 本模块首批接口从API version 3开始支持。后续版本的新增接口，采用上角标单独标记接口的起始版本。 8 9 10## 导入模块 11 12 13``` 14import mediaquery from '@system.mediaquery'; 15``` 16 17 18## mediaquery.matchMedia 19 20matchMedia(condition: string): MediaQueryList 21 22根据媒体查询条件，创建MediaQueryList对象。 23 24**系统能力：** SystemCapability.ArkUI.ArkUI.Full 25 26**参数：** 27 28| 参数名 | 类型 | 必填 | 说明 | 29| --------- | ------ | ---- | -------- | 30| condition | string | 是 | 用于查询的条件。 | 31 32**返回值：** 33 34| 参数类型 | 说明 | 35| -------------- | ---------------------------------------- | 36| MediaQueryList | 表示创建MediaQueryList对象的属性，详情见下表 MediaQueryList说明。 | 37 38**示例：** 39 40``` 41var mMediaQueryList = mediaquery.matchMedia('(max-width: 466)'); 42``` 43 44## MediaQueryEvent 45 46定义MediaQuery事件。 47 48**系统能力：** SystemCapability.ArkUI.ArkUI.Full 49 50| 名称 | 参数类型 | 必填 | 说明 | 51| ------- | ------- | ---- | ----- | 52| matches | boolean | 是 | 匹配结果。 | 53 54## MediaQueryList 55 56定义MediaQuery列表信息。 57 58### 属性 59 60**系统能力：** 以下各项对应的系统能力均为SystemCapability.ArkUI.ArkUI.Full 61 62| 名称 | 参数类型 | 必填 | 说明 | 63| ------- | ------- | ---- | ----------------- | 64| media | string | 否 | 序列化媒体查询条件，该参数为只读。 | 65| matches | boolean | 是 | 匹配结果。 | 66 67### onchange 68 69onchange?: (matches: boolean) => void 70 71matches状态变化时的执行函数。 72 73**系统能力：** SystemCapability.ArkUI.ArkUI.Full 74 75**参数：** 76 77| 参数名 | 类型 | 必填 | 说明 | 78| ------- | ------- | ---- | -------------- | 79| matches | boolean | 是 | matches状态变化时值。 | 80 81 82### MediaQueryList.addListener 83 84addListener(callback: (event: MediaQueryEvent) => void): void 85 86给MediaQueryList添加回调函数，回调函数应在onShow生命周期之前添加，即需要在onInit或onReady生命周期里添加。 87 88**系统能力：** SystemCapability.ArkUI.ArkUI.Full 89 90**参数：** 91 92| 参数名 | 类型 | 必填 | 说明 | 93| -------- | -------------------------------- | ---- | -------------- | 94| callback | (event: MediaQueryEvent) => void | 是 | 匹配条件发生变化的响应函数。 | 95 96**示例：** 97 98``` 99function maxWidthMatch(){ 100 if(e.mathes){ 101 // do something 102 } 103} 104mMediaQueryList.addListener(maxWidthMatch); 105``` 106 107 108### MediaQueryList.removeListener 109 110removeListener(callback: (event: MediaQueryEvent) => void): void 111 112移除MediaQueryList中的回调函数。 113 114**系统能力：** SystemCapability.ArkUI.ArkUI.Full 115 116**参数：** 117 118| 参数名 | 类型 | 必填 | 说明 | 119| -------- | --------------------------------- | ---- | -------------- | 120| callback | (event: MediaQueryEvent) => void) | 是 | 匹配条件发生变化的响应函数。 | 121 122**示例：** 123 124``` 125function maxWidthMatch(){ 126 if(e.mathes){ 127 // do something 128 } 129} 130mMediaQueryList.removeListener(maxWidthMatch); 131``` 132 133 134 135
