上传文件时 Outlook Web 加载项经常崩溃
Outlook web add-in crashes frequently while uploading file
我正在使用 ReactJs 开发 Outlook Web 插件,我在使用此文件上传器的地方编写了任务窗格插件。因此,每当我尝试上传任何大小(小或大)的任何文件时,任务窗格都会崩溃并重新启动加载项。大多数情况下,它发生在第一次上传任何文件时。我是在代码中做错了什么还是任何 Outlook 问题?
我还为 dropzone 尝试了一些 react npm 包,但也出现了同样的错误。我已附上错误截图、outlook 警报事件和我的文件上传器代码。
Windows10家(19041.388)
Outlook 版本 2007(内部版本 13029.20344 点击-运行)
import * as React from "react";
import { MessageBar } from "office-ui-fabric-react/lib/MessageBar";
interface DocumentUploaderProps {
handleOnDropFiles: (files: any, callback?: any) => void;
}
export default class DocumentUploader extends React.Component<DocumentUploaderProps> {
inputFileRef;
constructor(props) {
super(props);
this.inputFileRef = React.createRef();
}
dragOver = (e) => {
e.preventDefault();
}
dragEnter = (e) => {
e.preventDefault();
}
dragLeave = (e) => {
e.preventDefault();
}
fileDrop = (e) => {
e.preventDefault();
const files = e.dataTransfer.files;
this.props.handleOnDropFiles(files, () => this.inputFileRef.current.value = "");
}
onClickDropzone = () => {
this.inputFileRef.current.click();
}
render() {
return (
<div className="ms-Grid-row">
<div className="ms-Grid-col ms-sm12">
<div className="dz-container">
<section
className="dropzone"
onDragOver={this.dragOver}
onDragEnter={this.dragEnter}
onDragLeave={this.dragLeave}
onDrop={this.fileDrop}
onClick={this.onClickDropzone}
>
<div>
<input
ref={this.inputFileRef}
type="file"
style={{ display: "none" }}
onChange={(e) => this.props.handleOnDropFiles(e.target.files, () => this.inputFileRef.current.value = "")}
multiple
/>
<p className="upload-icon">
<i className="fas fa-file-upload" aria-hidden="true"></i>
</p>
<p className="ms-fontWeight-bold dropzone-msg">Click or drag files here</p>
</div>
</section>
</div>
</div>
</div>
);
}
}
我们能够使用 post 和 this related post 中的数据在内部重现此问题。我们已经修复了该错误,该修复程序应该在版本 16.0.13603.10000 或更高版本中可用。更新版本何时可用取决于客户使用的发布渠道。
我正在使用 ReactJs 开发 Outlook Web 插件,我在使用此文件上传器的地方编写了任务窗格插件。因此,每当我尝试上传任何大小(小或大)的任何文件时,任务窗格都会崩溃并重新启动加载项。大多数情况下,它发生在第一次上传任何文件时。我是在代码中做错了什么还是任何 Outlook 问题?
我还为 dropzone 尝试了一些 react npm 包,但也出现了同样的错误。我已附上错误截图、outlook 警报事件和我的文件上传器代码。
Windows10家(19041.388) Outlook 版本 2007(内部版本 13029.20344 点击-运行)
import * as React from "react";
import { MessageBar } from "office-ui-fabric-react/lib/MessageBar";
interface DocumentUploaderProps {
handleOnDropFiles: (files: any, callback?: any) => void;
}
export default class DocumentUploader extends React.Component<DocumentUploaderProps> {
inputFileRef;
constructor(props) {
super(props);
this.inputFileRef = React.createRef();
}
dragOver = (e) => {
e.preventDefault();
}
dragEnter = (e) => {
e.preventDefault();
}
dragLeave = (e) => {
e.preventDefault();
}
fileDrop = (e) => {
e.preventDefault();
const files = e.dataTransfer.files;
this.props.handleOnDropFiles(files, () => this.inputFileRef.current.value = "");
}
onClickDropzone = () => {
this.inputFileRef.current.click();
}
render() {
return (
<div className="ms-Grid-row">
<div className="ms-Grid-col ms-sm12">
<div className="dz-container">
<section
className="dropzone"
onDragOver={this.dragOver}
onDragEnter={this.dragEnter}
onDragLeave={this.dragLeave}
onDrop={this.fileDrop}
onClick={this.onClickDropzone}
>
<div>
<input
ref={this.inputFileRef}
type="file"
style={{ display: "none" }}
onChange={(e) => this.props.handleOnDropFiles(e.target.files, () => this.inputFileRef.current.value = "")}
multiple
/>
<p className="upload-icon">
<i className="fas fa-file-upload" aria-hidden="true"></i>
</p>
<p className="ms-fontWeight-bold dropzone-msg">Click or drag files here</p>
</div>
</section>
</div>
</div>
</div>
);
}
}
我们能够使用 post 和 this related post 中的数据在内部重现此问题。我们已经修复了该错误,该修复程序应该在版本 16.0.13603.10000 或更高版本中可用。更新版本何时可用取决于客户使用的发布渠道。