發表文章

目前顯示的是 四月, 2017的文章

[JavaScript] 將 CSV 檔案轉換成 JSON 資料

我們在拿到客戶提供的資料的時候常常會拿到 excel 檔案(這算幸福的)
至少我們可以簡單的利用一些軟體轉成 csv丟進資料庫裡處理。如果搭配個後端 API 基本上資料都不會是太大的問題可以做成 JSON 供 JavaScript 使用,但是如果在沒有後端或是資料庫的環境中呢?


首先我們先把 csv 檔案放到 server上 利用 $.get() 取得內容,接著將內容String 丟進我們待會會用到的 csvJSON 外掛 function 中。就會取得 JSON
但是這個時候的 JSON 還是 String 的形態所以還無法被解析,我們再加個 JSON.parse() 就可以拿到整個 JSON 物件摟!


function 來源:
https://gist.github.com/iwek/7154578

Vue.js 取得 ajax 清單資料

圖片
在 Vue.js 中並沒有內建自己的呼叫 ajax 功能,所以 Vue.js 官方有推薦一款 axios。

我們可以先試著用一下

axios.get("api_booking/get_order_list",{ params: { member_id: "james" } }).then(response => this.items = response.data.datalist); 上面這個例子就是我們可以利用 get 的方式去取得 API 的資料。我們可以看到這裡面直接可以使用 then 也就是說可以確認 api 是跑完了以後才執行裡面的動作。


new Vue({ el:"#list", data:{ items: [] }, mounted(){ axios.get("api_booking/get_order_list",{ params: { member_id: "james" } }).then(response => this.items = response.data.datalist); } })
結合 Vue.js 就會變成這樣。當取得資料後可以將資料寫入 items 這個變數給 Vue.js 使用