轉載自我的個人主頁

前言

在開發ExcelWeb插件的時候，一大亮點就是可以在web項目中操作Excel，讀取Excel的內容，也可以將服務端的數據寫入的 Excel中，大大方便的用戶使用Excel，提高工作效率

Ranges

Ranges表示Excel的區域，例如一個單元格的區域是=A1,多個單元格的區域，B1:B4表示連續的4個單元格，對Excel 內容的讀寫，即是對Ranges的讀寫。

Ranges的屬性

• address，表示Ranges的地址，例如：A1，B1:B4
• values,二維數組，表示區域的實際值
• texts,二維數組，表示區域的展示值
• formulas,二維數組，表示區域的公式，excel可以使用公式，使用之後，看到的值是公式計算之後的值，如果想要知道使用了那些公式，就需要使用formulas屬性
• format，區域的字體格式，可以該表文字字體，顏色，也可以改變區域的背景色。

• numberFormat,二維數組，區域的格式，有文本、日期、數值等，和Excel右擊設置單元格的格式裏所有的格式一致

  格式	值
  General	General
  Number	0
  Currency	$#,##0.00;[Red]$#,##0.00
  Accounting	($* #,##0.00);($* (#,##0.00);($* "-"??);(@_)
  Date	m/d/yy
  Time	[$-F400]h:mm:ss am/pm
  Percentage	0.00%
  Fraction	# ?/?
  Scientific	0.00E+00
  Text	@
  Special	;;
  Custom	#,##0_);Red
  來源	Stack Overflow上的回答

Ranges的方法

• load(),表示接下來你要使用哪個屬性，需要在此處表明，例如，你要使用address，則 range.load(‘address‘)。
• clear(),清空該區域
• delete(),刪除該區域，並指定是否需要下面的值上移，或者右面的值左移，參數枚舉值如下：
  • Excel.DeleteShiftDirection.up:刪除後，下面的值，向上移動填充空值
  • Excel.DeleteShiftDirection.left:刪除後，右面的值，向左移動填充空值
• select()，選中該區域
• copyFrom(),將指定區域的值復制給當前區域

具體用法

準備工作：

• 首先在vue中要安裝excel-addin

npm install excel-addin --save

• 在index.html中假如office.js

  <script src="https://appsforoffice.microsoft.com/lib/1/hosted/office.js"></script>

• 如果想要在Excel初始化時做些什麽，還需要在main.js中假如下面的代碼

const Office = window.Office
Office.initialize = () => {
    //初始化內容
}

• 操作Excel的行為均要寫在特定方法裏，即：

//其中context表示Excel的上下文，操作Excel的東西均通過該參數
 Excel.run(function(context) {
     //此處寫操作Excel的方法
     //處理完之後要提交，Excel才會識別，另外所有的//讀寫數據的操作均在，
     //context.sync().then(=>{
         //此處讀寫數據
     })
     return context.sync()
 }

寫入

    write: function() {
      Excel.run(function(context) {
        //獲取指定名字的工作薄sheet
        // var sheet = context.workbook.worksheets.getItem(‘sheetName‘)
        //獲取當前活動工作薄
        var sheet = context.workbook.worksheets.getActiveWorksheet()
        var data = [
          [‘Product‘, ‘Qty‘, ‘Unit Price‘, ‘Total Price‘],
          [‘Almonds‘, ‘2‘, ‘7.5‘, ‘15‘],
          [‘Coffee‘, ‘1‘, ‘34.5‘, ‘34.5‘],
          [‘Chocolate‘, ‘5‘, ‘9.56‘, ‘47.8‘],
          [‘‘, ‘‘, ‘‘, ‘97.3‘]
        ]
        //此二維數組的長度要和數據的保持一致，否則無效
        var formats = [
          [‘@‘, ‘@‘, ‘@‘, ‘@‘], //設置格式為文本
          [‘0.00‘, ‘0.00‘, ‘0.00‘, ‘0.00‘],
          [‘0.00‘, ‘0.00‘, ‘0.00‘, ‘0.00‘],
          [‘0.00‘, ‘0.00‘, ‘0.00‘, ‘0.00‘],
          [‘0.00‘, ‘0.00‘, ‘0.00‘, ‘0.00‘]
        ]

        var range = sheet.getRange(‘A1:D5‘)
        //選中該區域
        range.select()
        // 設置背景色和字體
        range.format.fill.color = ‘#4472C4‘
        range.format.font.color = ‘white‘
        //設置區域的格式
        range.numberFormat = formats

        //表示加載values屬性，如果不加載在下面是不可以使用的
        range.load(‘values‘)

        return context.sync().then(function() {
          //寫入方法必須在該方法內執行才有效
          range.values = data
        })
      }).catch(_this.errorHandler)
    },

讀取數據

read: function() {
      let _this = this
      Excel.run(function(context) {
        //獲取指定名字的工作薄sheet
        // var sheet = context.workbook.worksheets.getItem(‘sheetName‘)
        // 獲取當前選中的單元格
        var range = context.workbook.getSelectedRange()
        //獲取當前選中的單元格
        //表示加載以下屬性，如果不加載在下面是不可以使用的
        range.load(‘values‘)
        range.load(‘address‘)
        range.load(‘formulas‘)
        range.load(‘text‘)

        return context.sync().then(function() {
          //寫入方法必須在該方法內執行才有效
          _this.content = {
            values: range.values,
            formulas: range.formulas,
            address: range.address,
            texts: range.text
          }
          console.log(_this.content)
        })
      }).catch(_this.errorHandler)
    }

刪除某一行數據

deleteOne: function() {
      let _this = this
      Excel.run(function(context) {
        //獲取指定名字的工作薄sheet
        // var sheet = context.workbook.worksheets.getItem(‘sheetName‘)
        // 獲取當前選中的單元格
        var sheet = context.workbook.worksheets.getActiveWorksheet()
        var range = sheet.getRange(‘A2:D2‘)
        range.delete(Excel.DeleteShiftDirection.up)
        //提交操作
        return context.sync()
      }).catch(_this.errorHandler)
    },

清空所有數據

clear: function() {
      let _this = this
      Excel.run(function(context) {
        //獲取指定名字的工作薄sheet
        // var sheet = context.workbook.worksheets.getItem(‘sheetName‘)
        // 獲取當前選中的單元格
        var sheet = context.workbook.worksheets.getActiveWorksheet()
        var range = sheet.getRange(‘A1:D4‘)
        range.clear()
        //提交操作
        return context.sync()
      }).catch(_this.errorHandler)
    },

參考鏈接

Excel JavaScrip API

項目地址

項目鏈接

Office加載項對Excel進行讀寫操作