视口数据
命名空间:core/viewport。
选择器
isViewportMatch
如果视口匹配给定的查询则返回 true,否则返回 false。
用法
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>{ __( 'Mobile' ) }</div>
) : (
<div>{ __( 'Not Mobile' ) }</div>
);
};
参数
- state
Object: 视口状态对象。 - query
string: 查询字符串。包含运算符和断点名称,以空格分隔。运算符默认为 >=。
返回值
boolean: 视口是否匹配查询。
操作
此包中的操作不应直接使用。
暂无内容。
这篇文档对你有帮助吗?
谢谢你的反馈!