技術 Day23-試試Vue3-口袋餐廳的口袋清單(1)

口袋餐廳頁面下方區塊是篩選後的清單，以表單形式顯示所選的口袋餐廳。畫面示意圖請參考「Day14-試試Vue3-規劃口袋餐廳的頁面」篇。 (1)口袋餐廳清單-主表...

技術 ><點閱率太差了!fine~以「收穫心態」來回顧吧!

今年系列相較過往，點閱率變好差...是不是寫得「不夠好」...每當看別人的成就或是文章時，都覺得「喔～好厲害喔」「自己好像差很遠」...從來都沒有欣賞過自己，做...

技術 Day17-試試Vue3-口袋餐廳選單(2)

程式碼盡量只寫要說明的地方，無關的就不贅述。 (2)建立要導出的資料試著整理出動態渲染畫面所需的資料實體有哪些。以下說明 &lt;script&gt;&lt;/...

技術 開箱10:自適應高度TextArea～resize-textarea-vue3範例應用

本篇介紹根據內容自動更新文字區域的高度的工具resize-textarea-vue3 &lt;input&gt;只能輸入單行，而&lt;textarea&g...

技術 Day19-試試Vue3-口袋餐廳選單(4)

(3-2)動作拆解-品牌名稱與地址分為資料渲染與觸發方法兩部分說明。 1.下拉選項內容使用 v-for=&quot;item in filterRes.filt...

技術 開箱12:語音轉文字不專業版～SpeechRecognition範例應用

Web Speech API 可讓您將語音資料合併到 Web 應用程式中。分兩個功能：(Speech Synthesis)語音合成（文字轉語音）和(Speech...

技術 開箱20:前端用戶導覽這樣做～v-onboarding範例應用

當我們第一次使用某網站時，有時候網站會跳出導覽指引（就是教你怎麼用？），這可稱作網頁導覽或者用戶導覽（User Tour）或者 Onboarding （是指使用...

技術 Day22-試試Vue3-口袋餐廳選單(5-2)

前置作業1：調用 Pinia store 資料&lt;script&gt;&lt;/script&gt; 將 LoginStore.js 檔裡的 useLogi...

技術 開箱6:偵測螢幕寬度～useWindowSize範例應用

本篇開箱的是VueUse中的useWindowSize方法，簡單就能取得目前螢幕的寬高 介紹 VueUse 是一個基於Vue.js 的開源函式庫，主要是以...

技術 Day27-試試Vue3-餐廳實評頁面(2)

程式碼盡量只寫要說明的地方，無關的就不贅述。 (3-4)頁面表單提交的規範 點選任一張卡片時，表單中「餐廳評論」欄位才可進行編輯。否則唯讀狀態。 原本已有評...

技術 Day25-試試Vue3-規劃餐廳實評的頁面

「Day14-試試Vue3-規劃口袋餐廳的頁面」提到建立新頁面之前，建議專注於設計所需的 html 結構。這樣可以更好地思考如何渲染資料以及應該使用哪些 Jav...

技術 Day03-安裝Vue

安裝 Vue Cli npm install -g @vue/cli 創建 Vue 項目 vue create 自訂義的資料夾名稱 因為一些個人因素，之...