vue 將表格導(dǎo)出為excel表格

摘抄過來的,備忘<馈O捶 !
項(xiàng)目中將后臺返回的數(shù)據(jù)v-for到表格中陨倡,然后需要將這個表格導(dǎo)出為EXCEL

只說怎么做敛滋。

一、需要安裝三個依賴:

         npm install -S file-saver xlsx

         npm install -D script-loader

二兴革、項(xiàng)目中新建一個文件夾:(vendor---名字任纫锘巍)

里面放置兩個文件Blob.js和 Export2Excel.js蜜唾。

百度可下載。

三庶艾、在.vue文件中
   寫這兩個方法:其中l(wèi)ist是表格的內(nèi)容
    export2Excel() {
      require.ensure([], () => {
        const { export_json_to_excel } = require('../../vendor/Export2Excel');
        const tHeader = ['序號', 'IMSI', 'MSISDN', '證件號碼', '姓名'];
        const filterVal = ['ID', 'imsi', 'msisdn', 'address', 'name'];
        const list = this.tableData;
        const data = this.formatJson(filterVal, list);
        export_json_to_excel(tHeader, data, '列表excel');
      })
    },
    formatJson(filterVal, jsonData) {
      return jsonData.map(v => filterVal.map(j => v[j]))
    }

四袁余、按鈕導(dǎo)出調(diào)用export2Excel方法

注:如果webpack報解析錯誤:

在build----webpack.base.conf.js中resolve的alias加入 'vendor': path.resolve(__dirname, '../src/vendor'),
      即可解決
      alias是配置別名

Blob.js和 Export2Excel.js文件:鏈接: http://pan.baidu.com/s/1nvSdw85 密碼: 5qhi

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市咱揍,隨后出現(xiàn)的幾起案子颖榜,更是在濱河造成了極大的恐慌,老刑警劉巖煤裙,帶你破解...
    沈念sama閱讀 218,682評論 6 507
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件掩完,死亡現(xiàn)場離奇詭異,居然都是意外死亡硼砰,警方通過查閱死者的電腦和手機(jī)且蓬,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,277評論 3 395
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來题翰,“玉大人恶阴,你說我怎么就攤上這事”希” “怎么了存淫?”我有些...
    開封第一講書人閱讀 165,083評論 0 355
  • 文/不壞的土叔 我叫張陵,是天一觀的道長沼填。 經(jīng)常有香客問我,道長括授,這世上最難降的妖魔是什么坞笙? 我笑而不...
    開封第一講書人閱讀 58,763評論 1 295
  • 正文 為了忘掉前任,我火速辦了婚禮荚虚,結(jié)果婚禮上薛夜,老公的妹妹穿的比我還像新娘。我一直安慰自己版述,他們只是感情好梯澜,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,785評論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著渴析,像睡著了一般晚伙。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上俭茧,一...
    開封第一講書人閱讀 51,624評論 1 305
  • 那天咆疗,我揣著相機(jī)與錄音,去河邊找鬼母债。 笑死午磁,一個胖子當(dāng)著我的面吹牛尝抖,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播迅皇,決...
    沈念sama閱讀 40,358評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼昧辽,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了登颓?” 一聲冷哼從身側(cè)響起搅荞,我...
    開封第一講書人閱讀 39,261評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎挺据,沒想到半個月后取具,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,722評論 1 315
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡扁耐,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,900評論 3 336
  • 正文 我和宋清朗相戀三年暇检,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片婉称。...
    茶點(diǎn)故事閱讀 40,030評論 1 350
  • 序言:一個原本活蹦亂跳的男人離奇死亡块仆,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出王暗,到底是詐尸還是另有隱情悔据,我是刑警寧澤,帶...
    沈念sama閱讀 35,737評論 5 346
  • 正文 年R本政府宣布俗壹,位于F島的核電站科汗,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏绷雏。R本人自食惡果不足惜头滔,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,360評論 3 330
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望涎显。 院中可真熱鬧坤检,春花似錦、人聲如沸期吓。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,941評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽讨勤。三九已至箭跳,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間潭千,已是汗流浹背衅码。 一陣腳步聲響...
    開封第一講書人閱讀 33,057評論 1 270
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留脊岳,地道東北人逝段。 一個月前我還...
    沈念sama閱讀 48,237評論 3 371
  • 正文 我出身青樓垛玻,卻偏偏與公主長得像,于是被迫代替她去往敵國和親奶躯。 傳聞我的和親對象是個殘疾皇子帚桩,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,976評論 2 355

推薦閱讀更多精彩內(nèi)容