解决Bootstrap fileInput 上传excel或者是非图片附件时预览乱码问题

       以前上传文件,做的比较多的都是图片类的,其他类型的附件也有做,但不知是没有太在意还是前端框架里面已经封装好了,好像没有怎么发现上传excel 时会出现预览乱码问题,不过,根据今天的解决方法我菜只要是非图片类的,应该都会有这个问题。

乱码现象如下:

解决Bootstrap fileInput 上传excel或者是非图片附件时预览乱码问题_第1张图片

这个一看就知道,是Bootstrap fileInput把excel里面的内容读取出来了,本来解决思路是想说,让读取出来的内容不乱码,但百般查找后,没有发现有效的方案,于是换一个思路,直接让 Bootstrap fileInput 不读取预览内容就好了,跟着这个思路找,还真有这个配置,设置 当前预览的文件类型。

allowedPreviewTypes: ['image']

上述设置,将 Bootstrap fileInput 的允许预览文件类型设置成图片,而我们当前上传的是excel 就不会进行内容读取预览了,效果如下图:

解决Bootstrap fileInput 上传excel或者是非图片附件时预览乱码问题_第2张图片

因为我们需求中也没有要求一定要显示excel里面内容,所以当前解决方法也算是可以解决我的问题。

 

如果项目中需要显示当前excel中的内容,我个人觉得也可以完全不要这边预览,毕竟这边预览,位置太小,显示内容和格式肯定会乱掉,可以直接上传后,后端读取返回 excel内容,然后前端页面再渲染数据展示,这样不管是数据还是页面样式,我们都可以控制。

你可能感兴趣的:(异常处理记录,乱码,fileInput)