# 视口数据

命名空间：`core/viewport`

## 选择器

<!-- START TOKEN(Autogenerated selectors|../../../packages/viewport/src/store/selectors.js) -->

### isViewportMatch

若视口匹配指定查询条件则返回 true，否则返回 false。

_使用示例_

```js
import { store as viewportStore } from '@wordpress/viewport';
import { useSelect } from '@wordpress/data';
import { __ } from '@wordpress/i18n';
const ExampleComponent = () => {
	const isMobile = useSelect(
		( select ) => select( viewportStore ).isViewportMatch( '< small' ),
		[]
	);

	return isMobile ? (
		<div>{ __( '移动端' ) }</div>
	) : (
		<div>{ __( '非移动端' ) }</div>
	);
};
```

_参数说明_

-   _state_ `Object`: 视口状态对象
-   _query_ `string`: 查询字符串。包含运算符和断点名称，以空格分隔。运算符默认为 >=

_返回值_

-   `boolean`: 视口是否匹配查询条件

<!-- END TOKEN(Autogenerated selectors|../../../packages/viewport/src/store/selectors.js) -->

## 操作

此包中的操作不应直接使用。

<!-- START TOKEN(Autogenerated actions|../../../packages/viewport/src/store/actions.js) -->

暂无需要说明的内容

<!-- END TOKEN(Autogenerated actions|../../../packages/viewport/src/store/actions.js) -->