获取上传文件的大小 React JS

Question

我将如何在 React JS 中查找上传文件的大小？

Answer 1

比方说，你的 jsx 就像 <input type="file" onChange={this.fileChangedHandler}/>

现在，在您的fileChangedHandler, 您必须执行以下操作：

fileChangedHandler = (event) => {
    let file_size = event.target.files[0].size;

    //or if you like to have name and type
    let file_name = event.target.files[0].name;
    let file_type = event.target.files[0].type;
   //do whatever operation you want to do here
};

Answer 2

React.js 仅用于您的视图。你可以使用普通的 javascript 来完成其他事情。

如果您想使用 jquery 查找某个 url 处的文件大小：

var req = $.ajax({
  type: "HEAD",
  url: 'some/url/here',
  success: function () {
    console.log(req.getResponseHeader("Content-Length")); //Filesize
  }
});

在成功回调中，您可以使用 setState() 将大小保存到 React 的状态中，然后在渲染方法中的 div 中显示大小。

您也不限于使用 jquery 来处理 HEAD 请求。SuperAgent 是另一种流行的。