@wordpress/data–块编辑器手册|开发人员。WordPress.org网站

WordPress的数据模块是管理插件和WordPres本身的应用程序状态的中心，提供了管理不同模块内部和之间的数据的工具。它被设计为一种用于组织和共享数据的模块化模式：足够简单以满足小型插件的需求，同时可扩展以满足复杂的单页应用程序的需求。

数据模块建立在以下许多相同的核心原则之上重做，但不应被误认为仅仅是WordPress的重做，因为它包括一些自己的区别特征。阅读本指南时，您可能会发现参考Redux文档很有用，尤其是其词汇表-有关核心概念的更多详细信息。

安装

安装模块

npm install@wordpress/data--保存

此包假定您的代码将在2015年+环境。如果您使用的环境对此类语言功能和API的支持有限或不支持，您应该包括polyfill发货@wordpress/babel预设在代码中。

注册存储

使用登记函数将自己的存储添加到集中数据注册表。此函数接受一个参数–可以使用创建的存储描述符创建ReduxStore工厂功能。创建ReduxStore接受两个参数：一个用于标识模块的名称，一个带有描述状态如何表示、修改和访问的值的配置对象。至少，您必须提供一个reducer函数，描述状态的形状以及它如何响应发送到存储的操作而发生更改。

从“@wordpress/api-fetch”导入apiFetch；从“@wordpress/data”导入{createReduxStore，register}；常量DEFAULT_STATE={价格：｛｝，折扣百分比：0，};常量操作={setPrice（项目、价格）{返回{类型：'SET_PRICE'，项目，价格，};},开始销售（折扣百分比）{返回{类型：“START_SALE”，折扣百分比，};},fetchFromAPI（路径）{返回{类型：“FETCH_FROM_API”，路径，};},};const store=createReduxStore（'my-shop'{减速器（状态=DEFAULT_state，动作）{开关（action.type）{案例“SET_PRICE”：返回{…状态，价格：{…州价格，[action.item]：action.price，},};案例“START_SALE”：返回{…状态，discountPercent:操作.discountPerson，};}返回状态；},行动，选择器：{getPrice（状态，项）{const{prices，discountPercent}=状态；常量价格=价格[项目]；回报价格*（1-0.01*discountPercent）；},},控件：{FETCH_FROM_API（动作）{return apiFetch（{path:action.path}）；},},解析器：{*getPrice（项）{const路径='/wp/v2/prices/'+item；const price=收益actions.fetchFromAPI（路径）；return actions.setPrice（item，price）；},},} );寄存器（存储）；

的返回值创建ReduxStore是店面描述人包含两个属性的对象：

名称(一串)–商店名称
实例化(功能)–它返回一个类似Redux的存储对象使用以下方法：
- 获取状态（）：返回已注册减速机的状态值
  - 重做并行： 获取状态
- 订阅（侦听器：函数）：注册在状态值更改时调用的函数。
  - 重做并行： 订阅
- 调度（操作：对象）：给定一个操作对象，调用注册的reducer并更新状态值。
  - 重做并行： 派遣

重做存储选项

`减速器`

A类减速器是一个接受前一个的函数状态和行动作为参数并返回更新的状态值。

`行动`

这个行动对象应该描述所有动作创建者适用于您的店铺。动作创建者是一个函数，它可以选择性地接受参数并返回动作对象以分派给注册的reducer。调度操作是更改状态的主要机制。

`选择器`

这个选择器对象包含一组用于访问和派生状态值的函数。选择器是一个函数，它接受状态和可选参数，并从状态中返回一些值。调用选择器是从状态检索数据的主要机制，并作为原始数据的有用抽象，这些原始数据通常更容易更改，作为标准化对象.

`解析器`

A类分解器是选择器的副作用。如果您的选择器结果可能需要从外部源执行，那么您可以定义一个解析器，这样在第一次调用选择器时，执行行为就会生效。

这个解析器选项应作为对象传递，其中每个键是要操作的选择器的名称，该值是一个函数，该函数接收传递给选择器的相同参数，不包括状态参数。然后，它可以根据需要进行调度以满足选择器的要求，利用大多数数据使用者将订阅后续状态更改（通过订阅或使用Select).

`控制`

A类控制定义与特定操作类型相关联的执行流行为。这在为存储实现异步数据流时特别有用。通过将动作创建者或解析器定义为生成特定受控动作类型的生成器，执行将按照控制处理程序的定义进行。

这个控制选项应作为对象传递，其中每个键是要操作的操作类型的名称，值是接收原始操作对象的函数。它应该返回一个承诺，该承诺将在继续评估操作时解决，或者返回一个值。值或已解决的承诺值是在收益分配的返回值上分配的。如果控制处理程序返回未定义，则不会继续执行。

请参阅文件@wordpress/redux-routine了解更多信息。

`initialState（初始状态）`

存储的可选预加载初始状态。您可以使用它来恢复一些序列化的状态值或状态生成的服务器端。

普通商店

这个@文字新闻/数据模块提供了一个更高级和通用的接口，用于集成其他数据系统和需要对数据系统进行更直接控制的情况。在这种情况下，需要在外部实现数据存储@文字新闻/数据然后通过三个功能插入：

获取选择器（）：返回预先映射到存储区的选择器函数对象。
获取操作（）：返回预先映射到存储区的操作函数对象。
订阅（侦听器：函数）：注册在状态值发生变化时调用的函数。
- 表现为Redux订阅
  具有以下区别：
  - 不必实现退订，因为注册表从不使用它。
    -只需支持一个侦听器（注册表）。

通过为自定义存储实现上述接口，您可以获得使用注册表和使用Select和带Dispatch应用程序代码中的高阶组件。这提供了与现有和替代数据系统的无缝集成。

将现有的redux存储与其自己的还原器、存储增强器和中间件集成可以按以下方式完成：

例子：

从“@wordpress/data”导入{register}；从“导入现有选择器/现有应用程序/选择器；从“导入现有操作/现有应用程序/操作'；从“导入createStore/现有应用程序/商店'；const reduxStore=创建存储（）；const mapValues=（obj，回调）=>Object.entries（obj）.reduce(（acc，[键，值]）=>（{…根据，[key]：回调（value），} ),{});const boundSelectors=映射值(现有选择器，（选择器）=>（…args）=>选择器（reduxStore.getState（）。。。参数）);const boundActions=映射值(现有操作，（动作）=>（…参数）=>reduxStore.dispatch（操作（…args））);const通用存储={name:'现有应用程序'，实例化：（）=>（{getSelectors:（）=>boundSelectors，getActions:（）=>绑定操作，订阅：reduxStore.subscribe，} ),};寄存器（genericStore）；

还可以从头开始实现完全自定义的存储：

例子：

从“@wordpress/data”导入{register}；函数customStore（）{返回{name:'自定义数据'，实例化：（）=>{const监听器=new Set（）；常量价格={hammer:7.5}；函数storeChanged（）{for（const listener of listeners）{侦听器（）；}}函数订阅（侦听器）{listeners.add（监听器）；return（）=>listeners.delete（listener）；}常量选择器={getPrice（itemName）{退货价格[itemName]；},};常量操作={setPrice（项目名称，价格）{prices[itemName]=价格；storeChanged（）；},};返回{getSelectors:（）=>选择器，getActions：（）=>操作，订阅，};},};}寄存器（customStore）；

与Redux的比较

数据模块共享许多相同的核心原则和API方法命名属于重做事实上，它是在Redux上实现的。不同之处在于建立模块化模式以创建独立但相互依赖的存储，以及将选择器函数等约定编纂为数据访问的主要入口点。

这个高阶分量是为了补充这一区别而创建的。分裂的意图使用Select和带Dispatch-在React Redux中，它们在连接作为将状态映射到属性和将调度映射到属性参数-更准确地反映分派不依赖于状态更改的订阅，并允许在中使用状态派生值带Dispatch（通过高阶分量合成).

数据模块还具有处理异步副作用的内置解决方案，通过解析器和控制。这些与标准redux异步解决方案喜欢多余的大块或redux-saga公司.

与Redux和React Redux的具体实现差异：

在Redux中订阅侦听器在每次调度时都被调用，而不管状态的值是否已更改。
- 在@文字新闻/数据，只有在状态发生更改时才调用订户。
在React Redux中将状态映射到属性函数必须返回一个对象。
- 在@文字新闻/数据，一个使用Select映射函数可以返回未定义如果它没有可以注射的道具。
在React Redux中将调度映射到属性自变量可以定义为对象或函数。
- 在@文字新闻/数据，的带Dispatch高阶组件创建者必须传递一个函数。

美国石油学会

异步模式提供程序

上下文提供程序组件用于在同步和异步模式之间切换数据模块组件重新呈现。

用法

从“@wordpress/data”导入{useSelect，AsyncModeProvider}；从“@wordpress/block editor”导入｛store as blockEditorStore｝；函数BlockCount（）{常量计数=useSelect（（select）=>{return select（blockEditorStore）.getBlockCount（）；}, [] );返回计数；}函数App（）{返回(<AsyncModeProvider值={true}><块计数/></AsyncModeProvider>);}

在此示例中，BlockCount组件是异步重新呈现的。
这意味着如果正在执行更关键的任务（如输入），
重新呈现被延迟，直到浏览器变为IDLE。
可以嵌套多个级别的AsyncModeProvider来微调渲染行为。

参数

道具.value 布尔值：启用异步模式。

退换商品

组件：要渲染的组件。

组合减速器

combineReducers辅助函数将其值为不同还原函数的对象转换为单个还原函数，您可以将其传递给registerReducer。

用法

从“@wordpress/data”导入{combineReducers，createReduxStore，register}；常量价格=（状态={}，操作）=>{return action.type===“SET_PRICE”? {…状态，[操作项目]：操作价格，}：状态；};const discountPercent=（state=0，action）=>{return action.type===“START_SALE”？action.discountPercent:状态；};const store=createReduxStore（'my-shop'{减速器：组合减速器（{价格，折扣百分比，} ),} );寄存器（存储）；

类型

import（'./types'）.combineReducers

参数

减速器 对象：一个对象，其值对应于需要组合为一个的不同的归约函数。

退换商品

功能：调用reducers对象内的每个reducer，并构造具有相同形状的状态对象的reducer。

创建ReduxStore

为提供的Redux存储配置创建一个数据存储描述符，其中包含描述reducer、操作、选择器、控件和解析器的属性。

用法

从“@wordpress/data”导入{createReduxStore}；const store=createReduxStore（“演示”{reducer:（state='OK'）=>状态，选择器：{getValue:（state）=>状态，},} );

参数

钥匙 一串：唯一的命名空间标识符。
选项 ReduxStoreConfig<状态、操作、选择器>：注册的存储选项，其属性描述了reducer、actions、selector和resolver。

退换商品

StoreDescriptor<ReduxStoreConfig<状态、操作、选择器>>：存储对象。

创建注册表

给定初始存储配置的可选对象，创建新的存储注册表。

参数

存储配置 对象：初始存储配置。
起源 目标？：父注册表。

退换商品

WP数据注册表：数据注册表。

创建注册表控件

创建一个控制函数，该函数使用注册表对象。常规控件具有签名

（action）=>iteratorOrPromise；

控件与行动注册表控件具有签名：

（注册表）=>（action）=>iteratorOrPromise；

注册表控件通常用于选择数据或将操作发送到已注册的存储。

注册使用创建的控件时创建注册表控件对于存储，存储知道在执行控件时要使用哪个调用约定。

参数

注册表控件 功能：函数接收注册表对象并返回控件。

退换商品

功能：可以在存储中注册的注册表控件。

创建注册表选择器

创建一个选择器函数，该函数使用注册表中的附加curried参数选择功能。常规选择器具有签名

（state，…selectorArgs）=>结果；

允许从商店的状态，注册表选择器具有签名：

（选择）=>（状态，…selectorArgs）=>结果；

它还支持从其他注册商店中进行选择。

用法

从“@wordpress/core-data”导入{store as coreStore}；从“@wordpress/editor”导入｛store as editorStore｝；const getCurrentPostId=createRegistrySelector（（select）=>（state）=>{return select（editorStore）.getCurrentPostId（）；} );const getPostEdits=创建注册表选择器（（select）=>（state）=>{//像调用其他函数一样调用另一个注册表选择器const postType=getCurrentPostType（状态）；const postId=getCurrentPostId（状态）；return select（coreStore）.getEntityRecordEdits(“postType”，职位类型，帖子Id);} );

请注意获取当前帖子ID选择器可以像任何其他函数一样被调用，
（它甚至可以在常规的非注册表选择器中工作），我们不需要传递
注册表作为参数。注册选择器时会自动进行注册表绑定
和一家商店。

参数

注册表选择器 功能：接收注册表的函数选择函数并返回状态选择器。

退换商品

功能：可以在存储中注册的注册表选择器。

创建选择器

创建一个记忆选择器，该选择器根据“从属项”数组和选择器参数缓存计算值，并仅当其中任何值发生更改时才重新计算这些值。

相关的

的文档记忆从中创建选择器函数被重新导出。

参数

选择器 功能：从状态和参数计算值的选择器函数。
获取受抚养人 功能：返回“从属”对象数组的函数。

退换商品

功能：的备忘录版本选择器缓存计算的返回值的。

派遣

给定一个存储描述符，返回存储动作创建者的对象。调用动作创建者将导致其被调度，并相应地更新状态值。

注意：调度返回的操作创建者在被调用时将返回一个promise。

用法

从“@wordpress/data”导入{dispatch}；从“my-custom-store”导入{store as myCustomStore}；dispatch（myCustomStore）.setPrice（'hammer'，9.75）；

参数

存储名称或描述符 商店名称或描述符：存储描述符。还支持传递存储名称的传统调用约定。

退换商品

调度返回<StoreNameOrDescriptor>：包含动作创建者的对象。

寄存器GenericStore

已弃用使用寄存器（storeDescriptor）而不是。

注册通用存储实例。

参数

名称 一串：存储注册表名称。
商店 对象：存储实例({获取选择器，获取操作，订阅}).

寄存器存储

已弃用使用登记而不是。

注册标准@文字新闻/数据商店。

参数

商店名称 一串：存储的唯一命名空间标识符。
选项 对象：存储描述（减速机、操作、选择器、解析器）。

退换商品

对象：已注册的存储对象。

注册消费者

自定义反应上下文使用者公开提供的注册表子组件。与RegistryProvider一起使用。

您可以在此处阅读有关react上下文api的更多信息：https://react.dev/learch/passing-data-deply-with-context#step-3提供上下文

用法

导入{注册提供者，注册消费者，创建注册表}来自'@wordpress/data'；const注册表=创建注册表（{}）；常量应用程序=（{props}）=>{return<RegistryProvider value={registry}>你好<注册消费者>{（注册表）=>(<组件使用注册表{…道具}registry={registry}) }</RegistryConsumer></RegistryProvider>}

注册表提供程序

用于公开提供的的自定义上下文提供程序注册表通过消费者发送给子组件。

请参见注册消费者例如文档。

解决选择

给定一个存储描述符，返回一个对象，其中包含预绑定到状态的存储选择器，以便您只需要提供额外的参数，并进行修改，以便在运行任何解析器后返回解析为其最终值的承诺。

用法

从“@wordpress/data”导入{resolveSelect}；从“my-custom-store”导入{store as myCustomStore}；resolveSelect（myCustomStore）.getPrice（'hammer'）.then（console.log）；

参数

存储名称或描述符 StoreDescriptor |字符串：存储描述符。还支持传递存储名称的传统调用约定。

退换商品

对象：包含商店的promise-wrapped选择器的对象。

选择

给定存储描述符，返回存储选择器的对象。选择器函数已预先绑定以自动传递当前状态。作为使用者，您只需要传递选择器的参数（如果适用）。

用法

从“@wordpress/data”导入{select}；从“my-custom-store”导入{store as myCustomStore}；select（myCustomStore）.getPrice（“锤子”）；

参数

存储名称或描述符 字符串|T：存储描述符。还支持传递存储名称的传统调用约定。

退换商品

当前选择器：包含存储的选择器的对象。

给定一个侦听器函数，只要其中一个注册存储的状态值发生更改，就会调用该函数。如果指定可选存储名称或描述符参数，侦听器函数将仅在该特定注册存储的更新时调用。

此函数返回退订用于停止订阅的函数。

用法

从“@wordpress/data”导入{subscribe}；const unsubscribe=订阅（（）=>{//您可以利用此机会测试//选择器随后因状态更新而更改。} );//稍后，如有必要。。。取消订阅（）；

参数

听众 功能：回调函数。
存储名称或描述符 string|StoreDescriptor？：可选的存储名称。

挂起并选择

给定一个存储描述符，返回一个对象，该对象包含预先绑定到状态的存储选择器，因此您只需要提供额外的参数，并进行修改，以便在选择器尚未解析时抛出承诺。

参数

存储名称或描述符 StoreDescriptor |字符串：存储描述符。还支持传递存储名称的传统调用约定。

退换商品

对象：包含商店挂起的选择器的对象。

使用

扩展注册表以继承给定插件提供的功能。插件是一个对象，其属性与注册表的属性对齐，合并以扩展默认注册表行为。

参数

插件 对象：插件对象。

使用Dispatch

返回当前注册表分派操作创建者的自定义反应挂钩。

注意：使用此钩子的组件必须位于RegistryProvider的上下文中。

用法

这说明了您可能需要从中检索动态数据的模式
服务器通过使用Select与调度结合使用的挂钩
行动。

从'react'导入{useCallback}；从“@wordpress/data”导入{useDispatch，useSelect}；从“my-custom-store”导入{store as myCustomStore}；功能按钮（{onClick，children}）{返回(<button type=“button”onClick={onClick}>｛儿童｝</按钮>);}const SaleButton=（{children}）=>{const{stockNumber}=useSelect(（select）=>选择（myCustomStore）.getStockNumber（），[]);const{startSale}=useDispatch（myCustomStore）；const onClick=使用回调（（）=>{const discountPercent=stockNumber>50？10 : 20;startSale（discountPercent）；}，[stockNumber]）；return<Button onClick={onClick}>{children}</Button>；};//在应用程序中的某处呈现：////开始销售</销售按钮>

参数

存储名称或描述符 [商店名称或描述符]：可以选择提供要从中检索动作创建者的存储或其描述符的名称。如果未提供，则返回registry.dispatch函数。

退换商品

使用DispatchReturn<StoreNameOrDescriptor>：自定义反作用挂钩。

使用Select

自定义反应挂钩，用于从注册的选择器检索道具。

通常，此自定义React挂钩遵循吊钩规则.

用法

从“@wordpress/data”导入{useSelect}；从“我的自定义商店”导入｛store as myCustomStore｝；功能HammerPriceDisplay（{currency}）{常量价格=useSelect(（选择）=>{return select（myCustomStore）.getPrice（'hammer'，currency）；},[货币]);返回新的Intl.NumberFormat（'en-US'{style:'货币'，货币，}）.格式（价格）；}//在应用程序中呈现：//<HammerPriceDisplay货币=“USD”/>

在上述示例中，当HammerPriceDisplay（液压锤价格显示器）呈现为
应用程序，将使用
地图选择上的回调使用Select如果货币支柱发生变化，则
检索该货币的状态中的任何价格。如果货币支持
没有变化，而其他道具也会传递进来，但价格会发生变化
不会改变，因为依赖关系只是货币。

当数据仅用于事件回调时，不应检索数据
在render上，因此获取selectors函数可能很有用。

不要使用使用Select这样在渲染中调用选择器时
因为您的组件不会重新响应数据更改。

从“@wordpress/data”导入{useSelect}；从“我的自定义商店”导入｛store as myCustomStore｝；函数Paste（{children}）{const{getSettings}=useSelect（myCustomStore）；函数onPaste（）{//对设置进行处理。const settings=getSettings（）；}return<div onPaste={onPaste}>{childrens}</div>；}

参数

地图选择 T型：在每次状态更改时调用函数。返回的值向实现此挂钩的组件公开。该函数接收注册表。选择方法和注册表关于第二个论点。传递存储密钥后，将返回存储的所有选择器。这仅用于在事件回调中使用这些选择器，而不是用于创建元素树所需的数据。
deps公司 未知[]：如果提供，此选项会将mapSelect记忆为相同地图选择在每次状态更改时调用，除非依赖关系更改。

退换商品

使用SelectReturn：自定义反作用挂钩。

使用暂停选择

的变体使用Select钩子具有相同的API，但是兼容的启用了Suspense的数据源。

参数

地图选择 T型：在每次状态更改时调用函数。使用这个钩子将返回的值公开给组件。该函数接收注册表.spendSelect方法作为第一个参数注册表作为第二个。
deps公司 阵列：用于存储地图选择所以还是一样地图选择在每次状态更改时调用，除非依赖关系更改。

退换商品

返回类型<T>：由返回的数据对象地图选择功能。

带Dispatch

用于使用注册的动作创建者添加调度道具的高阶组件。

用法

功能按钮（{onClick，children}）{返回(<button type=“button”onClick={onClick}>{子}</按钮>);}从“@wordpress/data”导入{withDispatch}；从“my-custom-store”导入{store as myCustomStore}；const SaleButton=withDispatch（（dispatch，ownProps）=>{const{startSale}=分派（myCustomStore）；const{discountPercent}=ownProps；返回{onClick（）{开始销售（折扣百分比）；},};}）（按钮）；//在应用程序中呈现：////<SaleButton discountPercent=“20”>开始销售</销售按钮>

在大多数情况下，只使用两个第一个参数就足够了
传递给将调度映射到属性如前一示例所示。
然而，可能存在一些非常高级的用例，其中使用
注册表对象可以用作优化
您的组件。使用选择注册表中的函数可能有用
当您需要从存储中获取一些动态数据时
事件被激发，但同时，您永远不会使用它来呈现您的
组件。在这种情况下，可以避免使用使用Select较高的
命令组件计算此类属性，这可能导致不必要的
组件频繁的值更改导致的组件重新读取。
记住将调度映射到属性必须返回带有函数的对象
只有。

功能按钮（｛onClick，children｝）{返回(<button type=“button”onClick={onClick}>{子}</按钮>);}从“@wordpress/data”导入{withDispatch}；从“my-custom-store”导入{store as myCustomStore}；const SaleButton=withDispatch（（dispatch，ownProps，{select}）=>{//库存编号经常变化。const{getStockNumber}=选择（myCustomStore）；const{startSale}=分派（myCustomStore）；返回{onClick（）{const discountPercent=getStockNumber（）>50？10 : 20;startSale（discountPercent）；},};}）（按钮）；//在应用程序中呈现：////开始销售</销售按钮>

注：重要的是将调度映射到属性始终运行
返回具有相同键的对象。例如，它不应该包含
返回不同值的条件。

参数

将调度映射到属性 功能：返回属性名称对象的函数，其中值为分派绑定的动作创建者，或使用组件的属性调用的函数并返回动作创建器。

退换商品

组件类型：具有合并调度程序属性的增强组件。

带注册表

高阶组件，它使用传递的当前注册表上下文呈现原始组件注册表道具。

参数

原始组件 组件：原始组件。

退换商品

组件：增强组件。

使用Select

用于使用注册选择器注入状态派生属性的高阶组件。

用法

从“@wordpress/data”导入{withSelect}；从“my-custom-store”导入{store as myCustomStore}；函数PriceDisplay（{price，currency}）{返回新的Intl.NumberFormat（'en-US'{style:'货币'，货币，}）.格式（价格）；}const HammerPriceDisplay=withSelect（（select，ownProps）=>{const｛getPrice｝=选择（myCustomStore）；const{currency}=ownProps；返回{price:getPrice（'hammer'，currency），};}）（价格显示）；//在应用程序中呈现：////<HammerPriceDisplay货币=“USD”/>

在上述示例中，当HammerPriceDisplay（液压锤价格显示器）呈现为
应用程序，它将价格传递到基础价格显示
如果锤子的价格在
商店。

参数

将所选内容映射到属性 功能：在每次状态更改时调用函数，期望返回props的对象以与组件自己的props合并。

退换商品

组件类型：具有合并状态数据属性的增强组件。

批处理

作为对派遣调用，基于WordPress数据的应用程序更新连接的组件（使用使用Select或使用Select). 此更新分两步进行：

选择器以更新状态调用。
如果选择器返回的值与前一个不同（严格相等），则组件将重新呈现。

随着应用程序的增长，这可能会变得非常昂贵，因此，如果可能的话，确保我们避免同时运行这两个功能非常重要。当交互需要多个连续的派遣调用以正确更新状态。为了避免每次调用时重新渲染组件派遣，我们可以将顺序调度调用打包批处理这将确保组件在序列结束时只调用选择器并重新呈现一次。

用法

从“@wordpress/data”导入{useRegistry}；函数Component（）{const注册表=useRegistry（）；函数回调（）{//这将只重新渲染组件一次。registry.batch（（）=>{registry.dispatch（someStore）.someAction（）；registry.dispatch（someStore）.someOtherAction（）；} );}return单击我；}

选择器

以下选择器可用于返回的对象wp.data.select（“核心”）.

例子

从“@wordpress/core-data”导入{store as coreDataStore}；从“@wordpress/data”导入{useSelect}；函数Component（）{const结果=useSelect（（select）=>{常量查询={per_page:20}；const selectorArgs=['postType'，'page'，query]；返回{页面：select（coreDataStore）.getEntityRecords（…selectorArgs），hasStartedResolution：选择（核心数据存储）。hasStartedResolution('getEntityRecords'，//_selectorName_选择器参数),has Finished解决方案：选择(核心数据存储).hasFinishedResolution（'getEntityRecords'，selectorArgs），正在解析：选择（coreDataStore）。正在解析('获取实体记录'，选择器参数),};} );if（结果已开始解决）{return正在获取数据；}if（结果正在解决）{返回(<>{//显示微调器}</>);}if（result.hasFinishedResolution）{返回(<>{//数据准备就绪}</>);}}

已完成解决

如果给定选择器名称和参数集的解析已完成，则返回true。

参数

状态 州：数据状态。
选择器名称 一串：选择器名称。
参数 未知[]？：传递给选择器的参数。

退换商品

布尔值：解决是否已完成。

已开始解决

如果已为给定选择器名称和参数集触发解析，则返回true。

参数

状态 州：数据状态。
选择器名称 一串：选择器名称。
参数 未知[]？：传递给选择器的参数。

退换商品

布尔值：是否已触发解决。

正在解决

如果给定选择器名称和参数集的解析已触发但尚未完成，则返回true。

参数

状态 州：数据状态。
选择器名称 一串：选择器名称。
参数 未知[]？：传递给选择器的参数。

退换商品

布尔值：是否正在进行解决。

规范化选择器参数

在特定情况下，可能需要将传递给给定呼叫选择器/解析器配对的。

每个分解器都有其解析状态缓存在内部状态中其中key是提供给选择器的参数在呼叫时间。

例如，对于具有单个参数的选择器，相关解析器将生成以下缓存键：[ 123 ].

此缓存用于确定给定解析器的解析状态用于避免多余的解析器调用（通常需要执行“昂贵”的操作，例如网络请求）。

因此，重要的是保留论点一致的调用选择器时。例如，通过违约这两个调用将不会使用相同的密钥进行缓存，即使它们可能是相同的：

//参数为数字getSomeDataById（123）；//参数为字符串按Id获取数据（'123'）；

这是一个利用__不稳定NormalizeArgs属性通过保护调用方不传递错误类型来保证一致性。

例子

这个第三以下选择器的参数应为编号:

const getItemsSelector=（名称，类型，id）=>{return state.items[name][type][id]| | null；};

然而，有可能身份证件参数将作为字符串。在这种情况下__不稳定NormalizeArgs方法（属性）可以在选择器要将参数强制为所需类型，即使“错误地”提供了参数：

//定义规范化方法。获取项目选择器__unstableNormalizeArgs=（args）{//第二个索引处的“id”参数if（参数[2]和参数[2]的类型===“字符串”）{args[2]===数量（args[2]）；}返回参数；}

有了这一点，以下代码将表现一致：

const getItemsSelector=（名称，类型，id）=>{//这里的id现在保证是一个数字。return state.items[name][type][id]| | null；};const getItemsResolver=（名称、类型、id）=>{//“id”在解析器中也是一个数字。返回{}；};registry.registerStore（“存储”{// ...选择器：{getItems:getItemsSelector，},解析器：{getItems:getItemsResolver，},} );//用正确的号码类型呼叫。registry.select（'store'）.getItems（'foo'，'bar'，54）；//调用错误的字符串类型，**但**在这里我们避免了//需要解析程序调用，因为“54”被保证//通过“__unstatibleNormalizeArgs”方法强制为一个数字。registry.select（'store'）.getItems（'foo'，'bar'，'54'）；

确保给定选择器调用的参数的一致性是有助于提高数据层性能的重要优化然而，通过确保选择器不使用变量类型作为参数，通常可以避免此类问题。

走得更远

什么是WordPress数据？

参与此包

这是古腾堡项目的一部分。该项目组织为单回购。它由多个独立的软件包组成，每个包都有特定的用途。此monorepo中的包发布到净现值并由使用WordPress（文字出版社）以及其他软件项目。

要了解更多关于对这个包或古腾堡整体贡献的信息，请阅读该项目的主要内容投稿人指南.

@文字新闻/数据

在本文中

减速器

行动

选择器

解析器

控制

initialState（初始状态）

例子

`减速器`

`行动`

`选择器`

`解析器`

`控制`

`initialState（初始状态）`