如何对用户数据使用getEntityRecords
?
我已经阅读了这两篇文章,而且在Gutenberg的源代码中,似乎没有将用户端点作为getEntityRecords
的默认条目。
是否有可能通过REST向Gutenberg获取用户数据?
我尝试过使用此代码,但它返回一个空数组。
wp.data.select("core").getEntityRecords('user', 'user')
发布于 2020-04-06 17:43:53
So我猜你还在使用WordPress版本5.3.x? :)
因为如果是这样(我也是),那么是的,用户端点 (at wp/v2/users
)不包含在默认实体中。
但是您可以手动添加:
// Add the endpoint.
wp.data.dispatch( 'core' ).addEntities( [
{
name: 'user',
kind: 'root',
baseURL: '/wp/v2/users'
}
] );
这基本上就是在已定义 5.4中添加/ WordPress的方式。
然后,要获得实体记录,您可以这样做,这应该在WordPress 5.4和5.3.x中都能使用:
// Get multiple records.
wp.data.select( 'core' ).getEntityRecords( 'root', 'user', { per_page: 3 } );
// Get a single record.
wp.data.select( 'core' ).getEntityRecord( 'root', 'user', 123 );
wp.apiRequest()
注意,它使用jQuery.ajax()
,因此可以使用像done()
和fail()
这样的方法。
// Multiple records.
wp.apiRequest( { path: 'wp/v2/users', data: { per_page: 3 } } )
.done( data => console.log( data ) )
.fail( xhr => console.log( xhr.responseText ) );
// Single record.
wp.apiRequest( { path: 'wp/v2/users/123' } ).done( data => console.log( data ) );
wp.apiFetch()
// Multiple records.
wp.apiFetch( { path: 'wp/v2/users', data: { per_page: 3 } } )
.then( data => console.log( data ) )
.catch( data => console.log( data.message ) ); // here, 'data' is an object
// Single record.
wp.apiFetch( { path: 'wp/v2/users/123' } ).then( data => console.log( data ) );
但是无论您使用哪种选项,都要确保您用正确的依赖项对脚本进行排队--对于wp.apiRequest()
,脚本句柄/ID是wp-api-request
,而对于wp.apiFetch()
,则是wp-api-fetch
。
编码愉快!
对于您的评论,是的,如果API请求尚未得到解决,getEntityRecords()
将返回一个null
(例如,浏览器仍在接收来自服务器的响应)。
因此,您不能简单地执行result = wp.data.select( 'core' ).getEntityRecords( ... )
,并期望result
总是与API请求的响应一起分配。
相反,getEntityRecords()
应该与wp.data.select( 'core/data' ).isResolving()
一起使用,如下所示:
const { isResolving } = wp.data.select( 'core/data' );
// The last argument is the three arguments you passed to getEntityRecords().
isResolving( 'core', 'getEntityRecords', [ 'root', 'user', { per_page: 3 } ] );
示例:
wp.data.subscribe()
:const {订阅,选择}= wp.data;// Fetch用户列表。const query ={ per_page: 3 };选择( 'core‘).getEntityRecords( 'root','user',查询);const un订阅= subscribe( () => { const { isResolving }= select( 'core/data’);const args =;if ( isResolving( 'core','getEntityRecords',args )){ console.log(‘仍在解析’);{ const = select( 'core‘).getEntityRecords( 'root','user',查询);console.log(’数据接收‘,data );//我们完成了,所以让我们从上面的isResolving()检查中取消订阅。取消订阅( );});wp.data.withSelect()
:const { withSelect }= wp.data;const { createElement: el }= wp.element;const MyComponent = withSelect(选择=> { const { isResolving }= select( 'core/data‘);const查询={ per_page: 3 };返回{user: select( 'core’).getEntityRecords( 'root‘、'user’、query )、isRequesting: isResolving( 'core‘、'getEntityRecords’、} };)(支持=> { if ( props.isRequesting ){ //仍解析;因此显示一个“加载”指示器返回el( 'div',null,‘li data.’);} const list = props.users.map(用户=> el( 'li',{ key: user.id },user.name ) );返回el( 'ul',null,list );} );//然后在某个地方使用el( MyComponent )呈现上面的自定义元素。基本上,如果您要创建一个Gutenberg元素,那么您需要将getEntityRecords()
与withSelect()
结合使用。
我希望这能帮上忙。:)
https://wordpress.stackexchange.com/questions/363285
复制相似问题