xmind -zend文件解析

读取文件

  • 使用vue文件上传
  • FileReader 读取文件

FileReader 实现

 var inputObj=document.createElement('input')
      inputObj.setAttribute("accept",".xmind");
      inputObj.setAttribute('type','file');
      inputObj.setAttribute("style",'visibility:hidden');
      inputObj.setAttribute("value",'savefilename');
      inputObj.setAttribute('id','file');
      inputObj.setAttribute('name','file');
      document.body.appendChild(inputObj);
      inputObj.value;
      inputObj.click();
      inputObj.addEventListener('change', function () {
        if (!inputObj.value){
          return;
        }
        var file = inputObj.files[0]
        var reader = new FileReader();
        reader.onload = function(e){
          var data = e.target.result;
          const zip = new JSZip(data)
          // 区分xmind8与xmindzend
          console.log(zip.files.hasOwnProperty("manifest.json"));
          for (let filename in zip.files){
            if (filename  === "content.json") {
              let tmpArr = JSON.parse(zip.file(filename).asText());
              // 读取的文本包含多个画布tmpArr
              // 将每个画布解析为一个脑图文件
              // tmpArr.forEach((file,index)=>{
              //   console.log(file);
              // })
            }
          }
        }
        reader.readAsArrayBuffer(file)
      })

你可能感兴趣的:(前端)