iT邦幫忙

vue相關文章
共有 669 則文章
0 Like 0 留言 716 瀏覽
鐵人賽 Vue.js DAY 12
Nuxt 3 實戰筆記 系列 第 12 篇

技術 [Day 12] Nuxt 3 使用插件 (Plugin) 整合載入第三方套件 - 導入支援 Vue 3 的套件或插件

前言 為了不重複造輪子，在專案中導入現成的套件是常見的做法，但若這個套件在 Nuxt 3 沒有專用的模組或插件，再導入的過程中可能會遇到一些問題，多數情況我們可...

Ryan ‧ 2023-09-27 ‧團隊啾嚕咕嚕跳起來
0 Like 0 留言 329 瀏覽
鐵人賽 Vue.js DAY 12
這是我的 Vue.js 筆記，不知道有沒有機會幫到你 系列 第 12 篇

技術 我的 Vue.js 筆記(12) - watched 監聽器

前言 今天來補完 Vue 資料加工的最後一塊拼圖，監聽器。 在 computed 的內容中有提到，如果在 computed 寫 set 語法，不要寫出有副作用的...

imall ‧ 2023-09-27
0 Like 0 留言 553 瀏覽
鐵人賽 Vue.js DAY 11
Vue3歡樂套件箱耶 系列 第 11 篇

技術 開箱11:文字轉語音不專業版～Speech Synthesis範例應用

本篇開箱Web Speech API提供了瀏覽器內建的文字轉語音功能。 大家應該用過Google的語音功能吧？其實我們可以透過Web Speech API就...

切版姐姐 ‧ 2023-09-26
0 Like 0 留言 335 瀏覽
鐵人賽 影片教學 DAY 11
Nuxt 3 快速入門 系列 第 11 篇

技術 [影片教學] Nuxt 3 模組 (Modules)

👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗，👇下方是本篇教學的相關筆記。 使用 NuxtIcon 模組 安裝 NuxtIcon 套件...

Ryan ‧ 2023-09-26
0 Like 0 留言 707 瀏覽
鐵人賽 Vue.js DAY 11
Nuxt 3 實戰筆記 系列 第 11 篇

技術 [Day 11] Nuxt 3 自訂共用的函式 - 組合式函式 (Composables) 與通用函式 (Utils) 的差異和選擇

前言 Nuxt 3 預設的自動載入 (Auto Imports)，其中包含了 composables 與 utils 目錄，這兩個目錄通常會用來定義一些專案中常...

Ryan ‧ 2023-09-26 ‧團隊啾嚕咕嚕跳起來
0 Like 0 留言 436 瀏覽
鐵人賽 Vue.js DAY 11
這是我的 Vue.js 筆記，不知道有沒有機會幫到你 系列 第 11 篇

技術 我的 Vue.js 筆記(11) - methods 方法

前言 今天聊聊 Vue 實體中的 methods， 中文叫做「方法」。 如同我們在說「物件的方法」一樣，Vue 世界如果說到「方法」，其實就是在講函式(func...

imall ‧ 2023-09-26
0 Like 0 留言 442 瀏覽
鐵人賽 影片教學 DAY 10
Nuxt 3 快速入門 系列 第 10 篇

技術 [影片教學] Nuxt 3 插件 (Plugins)

👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗，👇下方是本篇教學的相關筆記。 建立插件來整合 Vue 3 套件 安裝 Vue Scroll...

Ryan ‧ 2023-09-25
0 Like 0 留言 1099 瀏覽
鐵人賽 Vue.js DAY 10
Nuxt 3 實戰筆記 系列 第 10 篇

技術 [Day 10] Nuxt 3 控制伺服器端及客戶端的渲染執行與 ClientOnly 的使用

前言 如果你只習慣使用 Vue 單純做客戶端渲染 (CSR)，對於 Nuxt 的伺服器端渲染 (SSR) 模式還不是那麼的熟悉，你可能會在開發過程有些時候明明記...

Ryan ‧ 2023-09-25 ‧團隊啾嚕咕嚕跳起來
1 Like 0 留言 492 瀏覽
鐵人賽 Vue.js DAY 10
這是我的 Vue.js 筆記，不知道有沒有機會幫到你 系列 第 10 篇

技術 我的 Vue.js 筆記(10) - computed 計算屬性

前言 我們已經知道模板語法中可以直接寫 JS 表達式，也知道表達式的邏輯可以抽方法來重複使用。 實務上還有一種情況，是需要「依據資料」整理出「對資料的說明」，簡...

imall ‧ 2023-09-25
0 Like 0 留言 288 瀏覽
鐵人賽 Vue.js DAY 9
Vue3歡樂套件箱耶 系列 第 9 篇

技術 開箱9:輕鬆實現多行文本溢出顯示...～vue-ellipsis-3範例應用

本篇開箱的是vue-ellipsis-3，是一款簡單上手就能實現的文字縮略元件。 相信大家在網頁功能上一定會碰到這個需求，超過某個寬度時要出現...省略號（...

切版姐姐 ‧ 2023-09-24
0 Like 0 留言 283 瀏覽
鐵人賽 影片教學 DAY 9
Nuxt 3 快速入門 系列 第 9 篇

技術 [影片教學] Nuxt 3 組合式函式 (Composables)

👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗，👇下方是本篇教學的相關筆記。 建立與使用組合式函式 在 composables 目錄下建立...

Ryan ‧ 2023-09-24
0 Like 1 留言 1113 瀏覽
鐵人賽 Vue.js DAY 9
Nuxt 3 實戰筆記 系列 第 9 篇

技術 [Day 09] Nuxt 3 發送 API 請求資料 - 從 $fetch 與 useAsyncData 到 useFetch

前言 在 Nuxt 3 中，你可以直接使用 useAsyncData、useFetch、useLazyAsyncData、useLazyFetch 函式來發送網...

Ryan ‧ 2023-09-24 ‧團隊啾嚕咕嚕跳起來
0 Like 0 留言 448 瀏覽
鐵人賽 Vue.js DAY 9
這是我的 Vue.js 筆記，不知道有沒有機會幫到你 系列 第 9 篇

技術 我的 Vue.js 筆記(9) - Vue 的模板

模板語法 先說一個觀念：模板，其實不完全等於 HTML，只是剛好 Vue 使用的模板語法，完全支援 HTML。所以我們使用 Vue 的時候如果提到的「模板」，可...

imall ‧ 2023-09-24
0 Like 0 留言 297 瀏覽
鐵人賽 影片教學 DAY 8
Nuxt 3 快速入門 系列 第 8 篇

技術 [影片教學] Nuxt 3 元件 (Components)

👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗，👇下方是本篇教學的相關筆記。 建立與使用第一個元件 在 components 目錄下建立一...

Ryan ‧ 2023-09-23
0 Like 1 留言 703 瀏覽
鐵人賽 Vue.js DAY 8
Nuxt 3 實戰筆記 系列 第 8 篇

技術 [Day 08] Nuxt 3 如何得知路由名稱與自定義頁面路由

前言 Nuxt 3 內建基於檔案的路由可以快速實現頁面的路由配置，我們只需要在 pages 目錄下建立頁面，Nuxt 將會自動載入 Vue Router 來實現...

Ryan ‧ 2023-09-23 ‧團隊啾嚕咕嚕跳起來
0 Like 0 留言 441 瀏覽
鐵人賽 Vue.js DAY 8
這是我的 Vue.js 筆記，不知道有沒有機會幫到你 系列 第 8 篇

技術 我的 Vue.js 筆記(8) - Vue 元件實體生命週期

前言 你可能會疑惑，我們還沒接觸元件，為什麼現在在講元件的生命週期 事實上，一個 Vue 實體，就是一個元件，所以我們只要開始使用 Vue 之後，就必須跟元件的...

imall ‧ 2023-09-23
0 Like 0 留言 427 瀏覽
鐵人賽 影片教學 DAY 7
Nuxt 3 快速入門 系列 第 7 篇

技術 [影片教學] Nuxt 3 布局模板 (Layouts)

👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗，👇下方是本篇教學的相關筆記。 建立第一個布局模板 在 layouts 目錄下建立一個檔案...

Ryan ‧ 2023-09-22
0 Like 1 留言 1265 瀏覽
鐵人賽 Vue.js DAY 7
Nuxt 3 實戰筆記 系列 第 7 篇

技術 [Day 07] Nuxt 3 使用 Dotenv 與 .env 檔案自動載入環境變數與配置 Runtime Config

前言 我們在使用 Node 開發時，可能會碰到需要使用環境變數來設定不同情境所執行的邏輯，也可能是要避免在設定檔中或專案推送至遠端版控倉庫時暴露敏感資訊。 你可...

Ryan ‧ 2023-09-22 ‧團隊啾嚕咕嚕跳起來
0 Like 0 留言 448 瀏覽
鐵人賽 Vue.js DAY 7
這是我的 Vue.js 筆記，不知道有沒有機會幫到你 系列 第 7 篇

技術 我的 Vue.js 筆記(7) - Vue 的實體與響應式狀態定義

前言 標題又出現了一個看起來很難懂的專有名詞：狀態。 這篇文章來聊聊 Vue 的「狀態」是什麼意思。 在開始說狀態之前，先簡單說一下 setup() 生命週期鉤...

imall ‧ 2023-09-22
0 Like 0 留言 307 瀏覽
鐵人賽 影片教學 DAY 6
Nuxt 3 快速入門 系列 第 6 篇

技術 [影片教學] Nuxt 3 頁面 (Pages) 與路由 (Routing)

👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗，👇下方是本篇教學的相關筆記。 建立第一個路由頁面 在 pages 目錄下建立一個檔案 ./...

Ryan ‧ 2023-09-21
0 Like 0 留言 332 瀏覽
鐵人賽 Vue.js DAY 6
Nuxt 3 實戰筆記 系列 第 6 篇

技術 [Day 06] Nuxt 3 專案分析開發工具 - Nuxt DevTools 視覺化工具系列

前言 Nuxt DevTools 是一個強大的視覺化除錯工具，，整合開發了許多工具與功能在除錯分析上它可以幫助你更快速的了解 Nuxt 專案，提升開發者體驗，本...

Ryan ‧ 2023-09-21 ‧團隊啾嚕咕嚕跳起來
0 Like 0 留言 211 瀏覽
鐵人賽 Modern Web DAY 15
從Vue學React！不只要會用，還要真的懂～ 系列 第 15 篇

技術 【Day 15】究竟是watch？還是生命週期API？處理副作用的useEffect

寫Vue的時候，偶爾會需要使用watch去監聽某個state的變動，來去進行一些邏輯操作。在接觸React之後，我發現React也有一個類似用途的hook，這個...

文科少女 ‧ 2023-09-21 ‧團隊曼陀號計畫V
0 Like 0 留言 510 瀏覽
鐵人賽 Vue.js DAY 6
這是我的 Vue.js 筆記，不知道有沒有機會幫到你 系列 第 6 篇

技術 我的 Vue.js 筆記(6) - Vue 的核心與實體(Instance)

Vue 的核心 這個主題寫在這篇其實有點「晚」了 不過也因為寫在這篇，相信有追完前面幾篇的讀者，已經能體會 Vue 有多「漸進」了。 之前有提到，尤大大當初只是...

imall ‧ 2023-09-21
0 Like 0 留言 453 瀏覽
鐵人賽 影片教學 DAY 5
Nuxt 3 快速入門 系列 第 5 篇

技術 [影片教學] Nuxt 3 目錄結構與自動載入 (Auto Imports)

👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗，👇下方是本篇教學的相關筆記。 專案目錄結構 .nuxt 目錄 開發環境下由 Nuxt 產生...

Ryan ‧ 2023-09-20
0 Like 0 留言 425 瀏覽
鐵人賽 Vue.js DAY 5
Nuxt 3 實戰筆記 系列 第 5 篇

技術 [Day 05] Nuxt 3 專案內部伺服器與進階開發工具 - Nuxt DevTools 視覺化工具系列

前言 Nuxt DevTools 是一個強大的視覺化除錯工具，Nuxt DevTools 整合開發了許多工具與功能在除錯分析上它可以幫助你更快速的了解 Nuxt...

Ryan ‧ 2023-09-20 ‧團隊啾嚕咕嚕跳起來
0 Like 0 留言 339 瀏覽
鐵人賽 Modern Web DAY 19
組裝前端開發工具箱，從 NX 入手 系列 第 19 篇

技術 在 NX 中建立 Vue 元件庫

來嘗試在 NX 中建立 Vue 元件庫 lib。 跟 Nuxt 一樣，目前官方沒有支援 Vue 的擴充，所以要手動設定。 首先建立一個基於 Vite 的 js...

Jasper ‧ 2023-09-20 ‧團隊我在鐵人賽烙賽、也在外木山裸泳◑ω◐
0 Like 0 留言 215 瀏覽
鐵人賽 Modern Web DAY 14
從Vue學React！不只要會用，還要真的懂～ 系列 第 14 篇

技術 【Day 14】設計樣式共用的元件！Vue有v-slot，那React可以怎麼做！？

對vue比較熟悉的朋友們，應該對於slot的使用都不陌生，slot對於增加元件的使用彈性上有著很大的幫助。但是React沒有vue框架中的v-slot，要怎麼彈...

文科少女 ‧ 2023-09-20 ‧團隊曼陀號計畫V
0 Like 0 留言 559 瀏覽
鐵人賽 Vue.js DAY 5
這是我的 Vue.js 筆記，不知道有沒有機會幫到你 系列 第 5 篇

技術 我的 Vue.js 筆記(5) - 初始化 Vue 以及 Vue 能控制的地方

經歷了前面幾篇文章，讀者大概已經對框架有最基本的認識。 我們來 "Get our hands dirty"，開始寫扣吧！ 建構 Vue 框架...

imall ‧ 2023-09-20
0 Like 0 留言 484 瀏覽
鐵人賽 SideProject30 DAY 4
30天挑戰：從無到有，使用Vue.js和.NET建立一個Web登入系統 系列 第 4 篇

技術 Day 4：環境篇 - 簡述Vue & .NET的專案架構

本篇重點： 說明Vue & .NET的專案架構 這些檔案or目錄分別代表什麼意思 前端畫面是怎麼來的 為什麼每次按重新整理，畫面上的天氣資料就會不...

ㄙ ㄩˊ ‧ 2023-09-19 ‧團隊NUTC_IMAC_WEB_桑貝比
0 Like 0 留言 376 瀏覽
鐵人賽 影片教學 DAY 4
Nuxt 3 快速入門 系列 第 4 篇

技術 [影片教學] Nuxt 3 安裝與使用 Tailwind CSS

👆建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗，👇下方是本篇教學的相關筆記。 設置 Tailwind CSS 環境 安裝 Nuxt Tai...

Ryan ‧ 2023-09-19
iThome鐵人賽
參賽組數
1123 組
團體組數
52 組
累計文章數
23096 篇
完賽人數
656 人
iT+看影片追技術 看影片追技術 看更多
熱門tag 看更多
15th鐵人賽 13th鐵人賽 14th鐵人賽 12th鐵人賽 11th鐵人賽 鐵人賽 2019鐵人賽 2018鐵人賽 javascript 2017鐵人賽 python windows php c# windows server linux css react 程式設計 vue.js
熱門問題
熱門回答
熱門文章
IT邦幫忙