用 Vue.js 創造華麗的國旗動態效果 這次我們來玩點有趣的東西!我們的 SVG 特輯靈感來自台灣國旗,設計比例可是參考了維基百科上的資料哦。而且,我們不...
還記得昨篇開箱:前端用戶導覽這樣做~v-onboarding範例應用,其中導覽的框是依賴PopperJS做出來的,那我們今天要介紹在Vue3中可以使用的視窗元件...
在前端網站效能優化中,圖片處理是一個重要的部分,因為圖片通常是網頁中佔用大量頻寬和資源的元素之一。而關於圖片處理的實踐方法有多種,其中一種是將圖片壓縮,這在本系...
系列總回顧 https://ithelp.ithome.com.tw/articles/10339831 睽違兩年姐姐再度登場拉!看到很多前輩說每年都不想參...
什麼是Mixins? Mixins 是 Vue.js 中用來封裝重用的功能的一種方式。當你發現多個組件有共用的邏輯,但卻不適合使用組件繼承或其他方法時,可以使用...
什麼是Vuex? 當我們的應用越來越複雜,並且多個組件需要共享相同的狀態時,這時我們需要一個集中式的狀態管理。Vuex 就是為此而生,它為我們提供了一個集中管理...
昨天說明了VueRouter基本的使用,今天要進階說明VueRouter的兩個功能,分別是路由守衛和路由懶加載。 路由守衛(Route Guards) 路由守衛...
Vue Router Vue Router 是官方的路由管理器,允許我們建立單頁應用(SPA)。隨著 Vue 應用不斷增長,我們需要的不只是基礎功能,還有如何管...
Vue.js基礎之數據綁定 數據綁定是Vue的核心功能之一,允許我們建立視圖(模板)與數據之間的關聯。當數據發生變化時,視圖會自動更新,反之亦然。 開新專案(步...
前言 在處理響應式多選表單時,使用 v-model 綁定陣列類型的資料,用 ref() 沒問題,但用 reactive() 卻行不通QQ~為什麼~~~ 就是下面...
前言 Vue 在官方文件 - Reactivity Fundamentals 中,正式進入 reactive() 和 ref() 之前,先提到了 nextTic...
前言 一開始認識 reactive() 跟 ref() 真的超困惑,不理解兩者背後的差別,只能硬記個別的使用方式和限制,一直到了解他們背的原理,才有「啊哈~」的...
前一篇說到 該怎麼寫 data 的資料,找回雙向綁定機制 !!!這邊先小小的補充一下 XD 在 Options API 我們 data 裡定義到的東西都可以被...
我在 Localhost 開發的時候會出現錯誤訊息 GET http://192.168.43.55:8081/sockjs-node/info?t=16281...
我在 Localhost 開發的時候會出現一個錯誤訊息困擾有許久,而且是機率性的。因為以 SPA(Single-Page Application) 開發專案項目...
如果你有 Localhost 開發環境需要以 HTTPS 瀏覽時,可以參考以下方法: 方法一:vue.config.js module.exports = {...
回顧30天,也讓我回憶了今年從金融業被抓去做開發工程師的日子。這30天中,講述了Vue的基本介紹、性能比較,也依據Vue的特性, 實作出許多app。 當然,雖...
Vue:還記得第10天時,我們才剛認識Vue CLI,但你還記得我的介面嗎? 接著,我們試試看這個指令: npm run build 如此,產生的資料即打包嚕...
Vue:實做部落格最後一步驟,就是修改文章!上一篇已經了解如何將id生成,如此才可以做個別文章上的操作。原先,在Article頁面上,我們可以加上一個標示,讓文...
Vue:昨日,我們已將文章新增實做出來了!現在只要將文章列舉在首頁,只需要使用之前學到的v-for迴圈,即可完成!透過 v-for,將vuex中state的ar...
Vue:文章為本專案的共用資料。當許多頁面都需要用到時,這個時候使用Vuex就是最佳時機。下圖,可以看到,在其中一個元件下(Add-Article元件)新增文章...
Vue:接下來透過幾天,我們將把之前學的router、Vuex等,實現在這個專案上面。由上圖首頁,除了基本路由設定(首頁和文章),將會以組件方式生成文章列表:文...
需要用的頁面上: import Action和 State進來 透過methods調用mapActions 透過computed調用mapState...
Vue:資料改變,除了利用method或computed,還有getter。 Getter好處是當資料集中管理,部分組件或元件需要用到不同資料下,可提供相對應的...
Vue:今日首先來了解一下Vuex中的State部分:State部分來說,相當於Vue的data,專門儲存資料。我們首先可以在這邊定義資料來源,將其為我們所需要...
Vue:前陣子,我們學到了組件資料的相互傳遞,包含父元件利用props傳遞資料給子元件、子元件利用$emit傳遞給父元件。然而,這些都是單向資料傳遞:對於單一請...
Vue:昨日講述了基本的Route設定後,今天我們再來看看巢狀路由吧! 對於頁面上的切換,是很容易透過Route做到的。但有沒有可能,會需要將頁面某一部分,作為...
Vue:設定基本路由,可以拆解成以下步驟: 定義模板 template 配置模板路線(routes)(每一條路線,都會對應到相應的component;而這邊的...
Vue:還記得在Vue CLI建置專案時候,也有遇上Vue Router嗎?無論你是使用history mode或hash mode,設置路由,將可以導入到正確...
第12 屆iT邦幫忙鐵人賽系列文章 (Day19) Azure Table Azure Table 是一個具有結構性的 NoSQL 服務,如果資料結構不具備太複...