该模块是一个媒体上传处理器,具有使用自定义 @wordpress/data store 实现的类似队列的系统。
这样的系统可用于在将媒体文件上传到服务器之前,对其进行额外的客户端处理(例如图片压缩)。
它通常由 @wordpress/block-editor 使用,但也可以在其外部使用。
安装
安装该模块
npm install @wordpress/upload-media --save
用法
以下是如何与上传数据存储交互的基本示例:
import { store as uploadStore } from '@wordpress/upload-media';
import { dispatch } from '@wordpress/data';
dispatch( uploadStore ).updateSettings( /* ... */ );
dispatch( uploadStore ).addItems( [ /* ... */ ] );
如需进一步帮助,请参阅下方的 API 参考或 TypeScript 类型。
API 参考
操作
以下一组可派发的操作创建器可在 wp.data.dispatch( 'core/upload-media' ) 返回的对象上使用:
addItems
向上传队列添加一个新项目。
参数
- $0
AddItemsArgs: - $0.files
AddItemsArgs[ 'files' ]:文件 - $0.onChange
[AddItemsArgs[ 'onChange' ]]:每次文件或文件的临时表示可用时调用的函数。 - $0.onSuccess
[AddItemsArgs[ 'onSuccess' ]]:文件上传后调用的函数。 - $0.onBatchSuccess
[AddItemsArgs[ 'onBatchSuccess' ]]:一批文件上传后调用的函数。 - $0.onError
[AddItemsArgs[ 'onError' ]]:发生错误时调用的函数。 - $0.additionalData
[AddItemsArgs[ 'additionalData' ]]:要包含在请求中的附加数据。 - $0.allowedTypes
[AddItemsArgs[ 'allowedTypes' ]]:包含可上传媒体类型的数组;如果未设置,则允许所有类型。
cancelItem
根据错误取消队列中的项目。
如果该错误可重试,并且该项目尚未超过最大重试次数,则它将被安排自动重试,而不是被取消。
参数
- id
QueueItemId:项目 ID。 - error
Error:错误实例。 - silent 是否静默取消该项目,而不调用其
onError回调。
executeRetry
为项目执行已安排的重试。
这由 scheduleRetry 中设置的定时器调用。它会在继续重试之前验证该项目是否仍处于 PendingRetry 状态。
参数
- id
QueueItemId:项目 ID。
retryItem
重试队列中失败的项目。
参数
- id
QueueItemId:项目 ID。
scheduleRetry
为失败项目安排自动重试。
使用带抖动的指数退避来确定重试延迟。该项目将被置于 PendingRetry 状态,并在计算出的延迟后自动重试。
参数
- id
QueueItemId:项目 ID。 - error
Error:导致失败的错误。
选择器
以下选择器可在 wp.data.select( 'core/upload-media' ) 返回的对象上使用:
getItems
返回当前正在上传的所有项目。
参数
- state
State:上传状态。
返回
QueueItem[]:队列项目。
getSettings
返回媒体上传设置。
参数
- state
State:上传状态。
返回
Settings:设置
isUploading
判断当前是否有任何上传正在进行。
参数
- state
State:上传状态。
返回
boolean:当前是否有任何上传正在进行。
isUploadingById
根据附件 ID 判断当前是否有上传正在进行。
参数
- state
State:上传状态。 - attachmentId
number:附件 ID。
返回
boolean:给定附件的上传当前是否正在进行。
isUploadingByUrl
根据附件 URL 判断当前是否有上传正在进行。
参数
- state
State:上传状态。 - url
string:附件 URL。
返回
boolean:给定附件的上传当前是否正在进行。