API先拿頭(header)來見API 來記錄一下這一周遇到的事情。 到年底,公司有許多專案都陸續進入客戶驗收階段,所以本周有許多在公司測試機測試過的程式要移到與正式環境相仿的雲端測試機,這也是我這個新手第二次經歷的事情。前一次寫圖台是一個新的專案,有前輩幫忙許多環境的設定,雖然跌跌撞撞,懵懵懂懂,在搞不清楚狀況的情形下,也順利完成任務。 但是年底這次佈署到雲端測試機的幾個專案,都是在既有的專案下新增功能或是修改一些bug,對我而言這是 2023-11-05 JavaScript #header, JavaScript, API
axios打API好管理 axios create在前一篇《axios打API手不痠》介紹過 axios 的基本用法,這一篇來談談在業界實務上的做法。 前面有提到 axios 要帶上正確的方法與路徑才能接到資料,所以基本的寫法如下: // axios.方法('路徑') axios.get('https://randomuser.me/api/') 但是如果一個專案中要打 20 次相同的API,而且每一次都要寫一段很長的路 2023-10-08 JavaScript #JavaScript, axios, API
axios打API手不痠 axios 官網 一個前端工程師的日常就是打不完的 API,接不完的資料。而串接 API 最常使用的函式庫莫過於 axios,但是雖然每天都在用,卻常常覺得用的只是皮毛,始終都沒有好好地去研究與了解 axios,這篇筆記就讓我好好來記錄一下 axios 的使用觀念與方法。 axios 官網開宗明義就寫到 axios 是基於 promise 的 HTTP 用戶端工具,供瀏覽器與 node.js使用。 2023-09-16 JavaScript #JavaScript, axios, API
2023切版直播班心得牆 當初為什麼報名這堂課之前陸續參加過JS直播班,也上過兩次的 VUE 直播班,一起上課的同學大多是參加切版直播班之後,才接著上 JS 跟 VUE。聽了同學的推薦,一直想找時間回來補齊切版技能與觀念,所以才會報名參加這堂課。 第一週~第八週的學習過程不同於JS直播班與VUE直播班時,那時我是全職學習,可以全心全意的上課與寫作業,現在是一邊上班一邊上課,要從夾縫中擠出時間也只能寫完第六周的作業,這一點十 2023-09-09 雜記 #六角學院
VUE元件--emit 事件外送 使用Vue 框架的時候,子元件要傳遞事件給父元件可以使用 emit。 在這裡要注意,子元件對父元件的事件沒有冒泡機制。 預設在子元件觸發事件的 DOM 元素上可以直接使用 $emit直接在子元件的 DOM 元素上使用$emit,就可以把事件傳遞到父元件,並不需要 defineEmits 定義子元件的 emit 事件才能使用。 <button @click="$emit('someEvent' 2023-07-02 Vue3 #emit, component
VUE元件--props資料捕手 在談 props 之前,先來說說子元件的資料來源: 自己的資料:也就是子元件裡面自定義的資料。 父元件 props 進子元件的資料:這是子元件跟父元件借資料來用,不屬於子元件所有。 Store 裡面大家公用的資料: 例如放在 pinia 與 vuex 裡面的資料。 如果是要同層級的元件間互相傳遞資料,或是跨好幾個層級的元件要傳遞資料,並不適合使用 props。 props 是子元件的資料接收 2023-06-30 Vue3 #props, component
ref再複習 寫了一陣子 VUE,也用了一陣子的 ref(),結果看了 Alex 的直播才發現自己和 ref() 有點陌生,回頭去好好讀了 VUE3 的官方文件,整理了一下筆記,方便回頭複習。 ref 重點整理 ref() 會將傳入參數的值轉換為帶有 .value 屬性的 ref 物件 如果 ref()放入的是物件,則 .value 屬性的值是proxy物件 ref() 是 refimpl 的物件 ref() 2023-06-17 Vue3 #Vue3, refs
輸入框變身搜尋下拉選單 最近常常遇到 PM 要求「下拉選單同時要有搜尋」的功能,之前在 Vue 裡面使用 V-select 套件來做,如果在原生的 JS 要寫這樣的功能,也找到 chosen.js 或 select2.js 這樣的套件可以做出這樣的功能。 剛開始我都以為「下拉選單同時要有搜尋」是使用<select> 表單元素去改的,但是在找資料的過程中,慢慢認知到可能不是用 select ,而是用 input 2023-05-25 JavaScript #JavaScript, input, search, selects
用給定的順序改變陣列本來的順序 公司要提供客戶美食優惠券,公司資料庫中有客戶偏好的食物類型,我心想這個簡單,不就打個 API 就把資料取回來了嗎,取回的資料結果如下: const arr=[ { name: "小明", type: "牛排", }, { name: "小華", type: "壽司", }, { name 2023-05-14 JavaScript #JavaScript,array,sort,indexOf
網頁截圖功能 DOM to image 最近在工作上需要寫網頁截圖的功能,所以稍微研究了一下 dom-to-image 這個插件,在我寫這篇筆記時的版本是 2.15.0。dom-to-imagenpm-dom-to-image 起手式npm如果要使用 npm 的方式可以參考以下安裝指令: npm install dom-to-image 官網範例**step1 ** node 參數放入要抓取截圖的 DOM 節點,config 的部分 2023-03-17 PlugIn #JavaScript, dom-to-image, plugin