@reacted/use-ajax-upload 是一个 React Hooks 插件，可以轻松实现 AJAX 文件上传的功能。此插件使用简单，可以使用无需获取过多的 AJAX 细节，最适合初学者。
安装
在项目中使用以下命令安装：
npm install @reacted/use-ajax-upload
用法
导入 useAjaxUpload hook，使用并传递 file 和 url 参数。
-- -------------------- ---- ------- ------ - ------------- - ---- --------------------------- -------- ----- - ----- - -------- - - ------------------- ----- ------ - -- --------- --------------- -- -- --------- -- --- -- -展开代码
现在，上传进度条将在页面上显示。
示例
以下示例演示如何在React应用程序中使用 @reacted/use-ajax-upload 插件。
-- -------------------- ---- ------- ------ ------ - -------- - ---- -------- ------ - ------------- - ---- --------------------------- -------- ----- - ----- ------ -------- - ------------- ----- ----- ------- - ------------- ----- - -------- - - ------------------- ----- ----- --------------------- - ------- -- - ------------------------------- -- ----- -------------------- - ------- -- - --------------------------- -- ------ - -- -------- ---- ---- ------- ------ ----------- -------------------------------- -- --- -- ------ ---------- ------------------------------- -- --- -- --------- --------------- -- -- --------- -- --- -- - ------ ------- ----展开代码
API
useAjaxUpload 参数如下：
file
文件对象。虽然该参数的类型不是严格限制的，但建议传入 File 对象，因为它具有有意义的字段，例如 name 和 type。
url
上传 URL。通过此参数指定文件上传的目的地。
返回值
一个对象包含以下属性：
progress
一个 0-100 的数，表示上传进度百分比。如果上传已完成，则此属性返回 null。
结论
现在您已经知道如何使用 @reacted/use-ajax-upload 实现了 AJAX 文件上传，并且不需要编写复杂的 AJAX 细节。希望这个插件可以帮助您实现类似的功能。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/reacted-use-ajax-upload
