1.npm install react-file-viewer
2.在组建中引入import FileViewer from 'react-file-viewer';
3.使用:
<FileViewer
fileType={this.state.imgFlieType}//文件类型
filePath={this.state.details.dragger}//文件地址
onError={console.log('错误信息')}
errorComponent={console.log('发生错误')}//[可选]:发生错误时呈现的组件,而不是react-file-
viewer随附的默认错误组件
unsupportedComponent={console.log('不支持')} //[可选]:在不支持文件格式的情况下呈现的组件
/>
注意:
在使用插件时出现如下报错时:
原因:react-file-viewer只支持文件网络地址,本地地址可能不支持
解决办法:需要把本地地址换成网络地址进行测试