程式設計VueJS 使用 Ref 綁定元件 分享綁定元件後操作 HTML DOM 的方法 Vue 2 / Options API <div ref=someRefName>Hello World</div> const refVar = "someRefName" (this.$re...2024.04.19程式設計
Network重置 macOS MySQL root 密碼 因為各個macOS或安裝的mysql版本不同、操作指令也有所不同,所以本篇利用分享最通用的方式來重置密碼 步驟 停止server 直接從 Setting Panel 中停止 進入安全模式 打開終端機 Terminal app sudo my...2024.04.19NetworkOS
OSHTML開發避免 iOS Safari 網址列擋住內文 iOS Safari 從第一代開始的實作規格中,一項一直為人詬病的就是「阻擋式網址列與工具列」。這種設計會讓網頁內文會被網址列蓋住,要在頁面向上滑動時,網址列與工具列才會自動縮小隱藏。而這卻是 Apple 從 iPhone 3 開始的 iO...2024.04.16OS程式設計
程式設計為何 e 可以輸入 input type=number 的標籤中? 學習 HTML 時,相信大家會有一個困惑,明明在 input tag 中指定類型為數字了,為何輸入時「字元"e"」還可以被輸入呢?真奇怪 <input type="number" value="123" /> e 的意義 乘以10的N次方 ...2024.04.11程式設計
程式設計用ES6 解構式使用 split 分割字串 例如常用的分割時間字串為「時」與「分」(HH:mm) 格式,直接用 這種寫法,直接將 String.split() 分割的字 assign 進變數中 // time = HH:mm export const extractHour = (t...2024.04.09程式設計
程式設計Vue 父子元件傳值 Hint 為了共用,子元件製作時儘可能做 loose coupling、才不會有多個子元件共同修改同一個值的問題loose coupling 的架構下,【父 ➞ 子】用 props 單向傳入、【子 ➞ 父】用 emits 單向傳出 不希望元...2024.04.01程式設計
程式設計Vue3 使用 CSSProperties 傳入 CSS 傳入CSS值 import type { CSSProperties } from "vue"; interface CheckboxProps { modelValue: boolean; checkboxStyle?: CSSPrope...2024.04.01程式設計
OS使用 dd 指令建立 USB 開機碟 $ diskutil list$ diskutil unmountDisk disk2 ( 修改別的disk號碼 )$sudo dd if=~/Downloads/archlinux-2023.07.01-x86_64.iso of=/de...2024.04.01OS
程式設計HTML5 Storage 儲存的差異 Local Storage vs IndexedDB LS: sync, IDB: asyncLS size < IDBLS: no transaction, IDB: support transactionIDB: support arr...2024.04.01程式設計
NetworkApache ataccess 轉址設定 如果連線的 https 是關閉的則轉址到 https <!-- wp:paragraph --> <p>RewriteEngine On</p> <!-- /wp:paragraph --> <!-- wp:paragraph --> <p...2024.04.01Network
Network重置 macOS MySQL root 密碼 因為各個macOS或安裝的mysql版本不同、操作指令也有所不同,所以本篇利用分享最通用的方式來重置密碼 步驟 停止server 直接從 Setting Panel 中停止 進入安全模式 打開終端機 Terminal app sudo my...2024.04.19NetworkOS
OSHTML開發避免 iOS Safari 網址列擋住內文 iOS Safari 從第一代開始的實作規格中,一項一直為人詬病的就是「阻擋式網址列與工具列」。這種設計會讓網頁內文會被網址列蓋住,要在頁面向上滑動時,網址列與工具列才會自動縮小隱藏。而這卻是 Apple 從 iPhone 3 開始的 iO...2024.04.16OS程式設計
OS使用 dd 指令建立 USB 開機碟 $ diskutil list$ diskutil unmountDisk disk2 ( 修改別的disk號碼 )$sudo dd if=~/Downloads/archlinux-2023.07.01-x86_64.iso of=/de...2024.04.01OS
OS在 Linux 使用 miracast 投影至 Amazon FireTV 前提條件 網卡支援 p2plinux systemd: >=221glib >= 2-2.38gstreamerwpa_supplicant~=check-0.9.11 安裝 miracast 下載 中利用 git 下載原始碼: git c...2024.03.30OS
OS舊版 Debian/Ubuntu 使用 Flatpak 安裝新App 前面的文章我們提到跨發行版套件管理系統:Flatpak, AppImage, Snap 的同異,其最大的好處就是可以在舊系統中安裝最新的 App 而不需要「被強迫」升級OS。而且跨發行版套件不會被各家 GNU/Linux 的原生管理系統制約...2024.03.23OS
OSFlathub vs Snap 獨立APP的差別 GNU/Linux ,因為各種發行版本都可自由創立,軟體之間有各式各樣的套件與程式依賴。因此常常發生安裝新APP時,會因程式與所需的函式庫套件的依賴版本不同而無法安裝。或是升級APP時需要新的函式依賴A,而在某版本的OS中可以又要更新依賴B...2024.03.20OS
OSImage Magick 常用功能 畫質壓縮 # 不縮小 convert DSC_0124.JPG -quality [0..100] img1.jpg # 縮小 convert DSC_0124.JPG -scale 20% -size 24% -quality [0..1...2024.03.20OS
OS電池實際容量與額定容量 「電池實際容量標示」 日文的寫法是「充電容量」。指未受其他因素影響,理想的電池容量。例如,未受放電倍率,轉換,溫度等物理影響 「電池額定容量」 日文的寫法是「定格容量」。指能量轉換後,固定的可用容量。簡易公式為「電池實際容量」×「電壓轉換」...2022.12.05OS
程式設計VueJS 使用 Ref 綁定元件 分享綁定元件後操作 HTML DOM 的方法 Vue 2 / Options API <div ref=someRefName>Hello World</div> const refVar = "someRefName" (this.$re...2024.04.19程式設計
OSHTML開發避免 iOS Safari 網址列擋住內文 iOS Safari 從第一代開始的實作規格中,一項一直為人詬病的就是「阻擋式網址列與工具列」。這種設計會讓網頁內文會被網址列蓋住,要在頁面向上滑動時,網址列與工具列才會自動縮小隱藏。而這卻是 Apple 從 iPhone 3 開始的 iO...2024.04.16OS程式設計
程式設計為何 e 可以輸入 input type=number 的標籤中? 學習 HTML 時,相信大家會有一個困惑,明明在 input tag 中指定類型為數字了,為何輸入時「字元"e"」還可以被輸入呢?真奇怪 <input type="number" value="123" /> e 的意義 乘以10的N次方 ...2024.04.11程式設計
程式設計用ES6 解構式使用 split 分割字串 例如常用的分割時間字串為「時」與「分」(HH:mm) 格式,直接用 這種寫法,直接將 String.split() 分割的字 assign 進變數中 // time = HH:mm export const extractHour = (t...2024.04.09程式設計
程式設計Vue 父子元件傳值 Hint 為了共用,子元件製作時儘可能做 loose coupling、才不會有多個子元件共同修改同一個值的問題loose coupling 的架構下,【父 ➞ 子】用 props 單向傳入、【子 ➞ 父】用 emits 單向傳出 不希望元...2024.04.01程式設計
程式設計Vue3 使用 CSSProperties 傳入 CSS 傳入CSS值 import type { CSSProperties } from "vue"; interface CheckboxProps { modelValue: boolean; checkboxStyle?: CSSPrope...2024.04.01程式設計
程式設計HTML5 Storage 儲存的差異 Local Storage vs IndexedDB LS: sync, IDB: asyncLS size < IDBLS: no transaction, IDB: support transactionIDB: support arr...2024.04.01程式設計
程式設計ES6 array sort 並建立新矩陣 Array 排序 Array.sort( ) 本身是不給予新的記憶體位置的,只是修改矩陣內的數值排列 const people = [ { name: "Alice", height: 165 }, { name: "Bob", heigh...2024.03.29程式設計
程式設計Nuxt3 如何引入環境變數 在 Vue2 或 Vue3 的專案中,我們常常會引入環境變數,例如 process.env.NODE_ENV === 'development'、process.env.NODE_ENV === 'production',來區分不同工作環境...2024.03.26程式設計
程式設計Vue3 無法watch string型態的 prop 在子元件中,若想監看傳入的 props 有無變化時,我們會使用 watch( ) 。但是若 prop 是 primitive type 的時候,會出現下列的錯誤 (以 string為例) Argument of type 'string' ...2024.03.21程式設計