前端(vue)JSZIP读取压缩包文件,JSZIP解决乱码

前端(JS\VUE)JSZIP读取压缩包文件内容,JSZIP解决乱码

主要需要需要安装jszip

npm i jszip -S

下面是用vue 做为演示(如果只用vue其实可以省略jquery)

<template>
  <div>
    <h3>选择一个压缩文件</h3>
    <input type="file" id="file" name="file" multiple /><br />

    <div id="result_block" class="hidden">
      <h3>压缩包中文件列表 :</h3>
      <div id="result"></div>
    </div>
  </div>
</template>

<script>
import JSZip from "jszip";
import $ from "jquery";
export default {
  methods: {
    handleFile(f) {
      let _this = this;
      //显示Zip名和创建filesname的ul容器
      var $title = $("<h4>", {
        text: f.name,
      });
      var $fileContent = $("<ul>");
      $("#result").append($title);