小程序API（1.11）利用wx.saveFile()、wx.getSavedFileList()、 wx.getSavedFileInfo() 和 wx.removeSavedFile() 操作文件的方法

 

 

 

 

<!--pages/index.wxml-->
<view class='box'>
  <view class='title'>文件操作</view>
  <image src='{{imgPath}}'></image>
  <view class='btnLayout'>
    <button type='primary' bindtap='openFile'>打開文件</button>
    <button type='primary' bindtap='saveFile'>保存文件</button>
  </view>
  <view class='btnLayout'>
    <button type='primary' bindtap='getSavedFileInfo'>文件信息</button>
    <button type='primary' bindtap='removedSavedFile'>刪除文件</button>
  </view>
  <view class='fileInfo' hidden='{{hidden}}'><!--用來顯示文件信息-->
    <text>{{msg}}</text>
  </view>
</view>

/* pages/index.wxss */

page {
  text-align: center;/* 整個頁面默認的組件的對齊方式是居中對齊 */
}

.btnLayout {
  /*設置按鈕布局*/
  display: flex; /*設置布局類型*/
  flex-direction: row; /*設置布局方向*/
  justify-content: space-around; /*設置主軸方向控件的排列方式*/
}

button {
  width: 45%;
  margin: 5px;
}

.fileInfo {
  /*設置顯示文件信息區域的樣式*/
  margin: 10rpx 0; /*設置上下邊距為10rpx，左右邊距為0px*/
  background-color: #f8f8f8;
  text-align: left;
  border: 1px solid seagreen; /*設置邊框線的寬度、線條類型和顏色*/
}

space-around：沿主軸方向控件的排列方式，水平方向排列的時候各個組件之類間隔相同，兩邊留有一定的空間

// pages/index.js
var tempFilePaths, tempFilePath; //定義存放所有臨時文件和單個臨時文件路徑的全局變量
Page({
  data: {
    msg: '', //初始化的變量，小程序運行時沒有文件信息
    hidden: true //初始化的變量，小程序運行時隱藏文件信息顯示區域
  },
  openFile: function() { //定義打開文件函數
    var that = this;//本函數涉及到回調函數，在回調函數中一般不能使用this直接調用相應的函數
    wx.chooseImage({ //打開圖片文件
      success(res) {
        tempFilePaths = res.tempFilePaths //接口調用成功后，獲取所有打開圖片文件的路徑
        console.log('打開文件路徑：' + tempFilePaths)
        that.setData({
          imgPath: tempFilePaths[0], //顯示打開的第一張圖片
          hidden: false, //顯示文件信息區域
          msg: '文件打開成功！' //顯示文件操作信息
        })
      }
    })
  },

  saveFile: function() { //保存文件
    var that = this;
    wx.saveFile({ //調用保存文件的API函數，對象類型的參數
      tempFilePath: tempFilePaths[0], //獲取打開的第1個文件路徑
      success(res) { //將打開的第1個文件保存到res.savedFilePath
        console.log('保存文件路徑：' + res.savedFilePath); //顯示保存文件的路徑
        that.setData({
          hidden: false, //顯示文件操作信息
          msg: '文件保存成功!', //文件操作信息
        })
      }
    })
  },
  getSavedFileInfo: function() { //獲取已經保存的文件信息
    var i, file; //局部變量，某一個文件，具體的文件
    var that = this;
    wx.getSavedFileList({ //獲取所有已保存的文件
      success: function(res) { //將獲取的所有文件賦值給res.fileList
        if (res.fileList.length == 0) { //如果沒有保存的文件
          that.setData({
            hidden: false, //顯示文件信息
            msg: '沒有文件信息' //文件信息
          })
        } else {
          for (i = 0; i < res.fileList.length; i++) {
            file = res.fileList[i];
            console.log('第' + (i + 1) + '個文件路徑：' + file.filePath)
            wx.getSavedFileInfo({ //獲取已保存的文件信息
              filePath: file.filePath,
              success: function(res) { //將文件信息賦值給res
                console.log('第' + i + '個文件大小為：' + res.size)
                that.setData({
                  hidden: false, //顯示文件信息
                  msg: '文件數量：' + i + '\n最后一個文件的大小：' + res.size +
                    '\n最后一個文件的創建時間：' + res.createTime
                })
              }
            })
          }
        }
      }
    })
  },
  removedSavedFile: function() { //刪除文件
    var i, file;
    var that = this;
    wx.getSavedFileList({ //獲取已保存文件的列表
      success: function(res) { //將所有文件賦值給res.fileList
        for (i = 0; i < res.fileList.length; i++) { //遍歷文件列表
          file = res.fileList[i];
          wx.removeSavedFile({ //刪除已經保存的文件
            filePath: file.filePath,
          })
          console.log('第' + (i + 1) + '個文件被刪除！')
        }
        that.setData({
          hidden: false,
          msg: '文件被全部刪除'
        })
      }
    })
  }
})

實現對文件的操作，包括打開、保存和刪除文件，以及顯示文件信息等內容

API函數wx.saveFile(Object object)

API函數wx.getSavedFileList(Object object)

API函數wx.getSavedFileInfo(Object object)

API函數wx.removeSavedFile(Object object)

wx.saveFile(Object object) 用於將文件保存到本地，其參數主要屬性如下：

屬性	說明
tempFilePath	文件保存的臨時路徑
success	接口調用成功的回調函數
fail	接口調用失敗的回調函數
complete	接口調用結束的回調函數

 

      

 

 

 

 

wx.getSavedFileList(Object object)用於獲取該小程序已保存的本地緩存文件 列表，其參數屬性包括：success、fail和complete， 其中success函數的參數屬性fileList是文件數組類型。

wx.getSavedFileInfo(Object object)用於獲取本地文件信息。其參數屬性包括： filePath和success等，filePath是文件路徑，success 函數的參數屬性包括：size和createTime。

若要獲取臨時文件信息 ， 請使用 wx.getFileInfo() 接口。

wx.removeSavedFile(Object object)用於刪除本地緩存文件，其參數屬性包括： filePath 、 success 、 fail 和 complete ， 其 中 filePath是要刪除的文件路徑。