iT邦幫忙

vue router相關文章
共有 12 則文章
鐵人賽 Modern Web DAY 11
Vue.js 什麼意思 系列 第 11

技術 Day 11:Router 怎麼繞-router-link、router-view

大家應該也發現到了,目前點選 Navbar 項目並沒有任何反應;但是點選公版中的 Home 和 About 時: 點選 About,網址跳轉至「 http:/...

鐵人賽 Modern Web DAY 25
Vue.js 什麼意思 系列 第 25

技術 Day 25:從頭開始的 Scroll Behavior

目前導覽項目頁面愈來愈完整,相對有愈來愈多小細節需要留意,尤其是資料量變多時,許多瀏覽時伴隨的滾動效果多少會影響使用者體驗,因此除了顧及版面資料和操作功能,UX...

鐵人賽 Modern Web DAY 12
Vue.js 什麼意思 系列 第 12

技術 Day 12:Router 繞去哪-active-class & exact-active-class

上篇我們為 Navbar 設定好路由之後,接下來的需求則是希望能夠讓選取效果更為明顯,優化使用者體驗: hover 項目時,字體顏色顯示為紅色 ⇒ 跟隨游標移...

鐵人賽 Modern Web DAY 13
Vue.js 什麼意思 系列 第 13

技術 Day 13:巢狀路由的孩子-Nested Routes

目前設定的 Navbar 路由架構還算單純,並且只有單層路徑,但是當專案規模愈來愈大、功能類別拆分的愈趨詳細時,整體網站就相對需要更具層級性的規劃,此時路由架構...

鐵人賽 Modern Web DAY 5
30天Vue出Google SSO 系列 第 5

技術 Day 05. F2E-首頁開發

今天要來實作首頁的部分應該會有人覺得很奇怪,為什麼SSO會需要首頁? 做登入頁就好了吧? 需要首頁的原因是這樣的 你就做的跟Google一樣就好了!! 而...

鐵人賽 Modern Web DAY 24
Vue.js 什麼意思 系列 第 24

技術 Day 24:路由搜查隊-route.query

目前我們實現了即時搜尋顯示書名相符的書單資料,但是當我切換到其他路由之後又想再回到上一頁的搜尋結果,或是直接在當前路徑重新整理頁面時,搜尋欄位就被清空了,而書單...

鐵人賽 Modern Web DAY 20
Vue.js 什麼意思 系列 第 20

技術 Day 20:全域、路由、元件內-Navigation Guards

之前有預告過,發送 API 的時機點需視不同情境及 UX 體驗規劃而定,因此除了選擇在元件內的生命週期 created 發送,另外在 Vue Router 還有...

鐵人賽 Modern Web DAY 14
Vue.js 什麼意思 系列 第 14

技術 Day 14:動態 Route 對號入座

上篇完成了巢狀路由的設置之後,緊接著新需求又出現了!接續會員後台的收藏紀錄頁面,我們要進一步讓收藏的書單可以被購買: 點擊收藏紀錄中的單筆書目資料時,會進入購...

鐵人賽 Modern Web DAY 21
Vue.js 什麼意思 系列 第 21

技術 Day 21:總匯複習-Vuex、Route

前幾篇介紹了 Vuex 管理資料狀態,以及在生命週期或導航守衛發送 API 的時機點,再次回到專案範例,目前已處理好顯示導覽列中的全部書單內容,我們接續完成其他...

技術 Vue Router 學習筆記

建立 router 安裝 vue-router npm install vue-router --save 建立 routes.js ,用來設定 ro...

鐵人賽 Modern Web DAY 28

技術 Vue 3 用實作帶你看過核心概念 - Day 28:官方 Vue Router 的應用與技巧

目錄 Vue Router 基本使用 Vue Router 路由連結與路由守衛介紹 - RouterLink & Navigation Guards...

鐵人賽 JavaScript DAY 22

技術 【Day21】Vue Router幫我開路!

起初建立專案的時候,系統有詢問我們是否要導入Vue Router。用了是用了,不過它實質做了什麼改變呢?今天就來一探究竟吧! 特色 Client端路由:客端將...