今天繼續來增加功能，並再取得另一批資料來使用 目標四，再加入旅館 API 有了景點，再來解決住的部份，所以我們再繼續加入另一支 API ，取得旅館的訊息高雄市一...
上篇完成了巢狀路由的設置之後，緊接著新需求又出現了！接續會員後台的收藏紀錄頁面，我們要進一步讓收藏的書單可以被購買： 點擊收藏紀錄中的單筆書目資料時，會進入購...
本系列文已改編成書「Arduino 自造趣：結合 JavaScript x Vue x Phaser 輕鬆打造個人遊戲機」，本書改用 Vue3 與 TypeS...
鱈魚
‧
2021-09-29
話說~ 從疫情到現在，已經不知道多久沒出去玩了~好想出去玩玩喔~ 從開賽到現在已經默默地來到第二十天了~以目前所學習的內容，已經可以開發一個小小 Vue...
目前設定的 Navbar 路由架構還算單純，並且只有單層路徑，但是當專案規模愈來愈大、功能類別拆分的愈趨詳細時，整體網站就相對需要更具層級性的規劃，此時路由架構...
今天我們會利用上一篇的 分頁組件 範例來做更改，不過差別在於，這次我們父子組件的溝通不是透過 props & $emit 而是透過另一個方式來達成相同的...
前幾天我們介紹了如何將vue 物件中的屬性綁定到模板中，我們講到可以直接在模板中插入JavaScript 表達式來做運算，但實際上Vue不建議我們這麼做，若是簡...
組件的部份因為有比較複雜，所以會做個小練習來熟悉一點 - 分頁的組件 分頁組件(props & $emit 運用) 快速利用簡單的分頁組件範例來寫個小練...
本系列文已改編成書「Arduino 自造趣：結合 JavaScript x Vue x Phaser 輕鬆打造個人遊戲機」，本書改用 Vue3 與 TypeS...
鱈魚
‧
2021-09-27
上篇我們為 Navbar 設定好路由之後，接下來的需求則是希望能夠讓選取效果更為明顯，優化使用者體驗： hover 項目時，字體顏色顯示為紅色 ⇒ 跟隨游標移...
在前一篇中，我們已經了解父組件向子組件傳遞資料了，接著來認識子組件向父組件的溝通吧 子組件向父組件溝通: $emit 子組件(傳送) this.$emit(&q...
大家應該也發現到了，目前點選 Navbar 項目並沒有任何反應；但是點選公版中的 Home 和 About 時： 點選 About，網址跳轉至「 http:/...
本系列文已改編成書「Arduino 自造趣：結合 JavaScript x Vue x Phaser 輕鬆打造個人遊戲機」，本書改用 Vue3 與 TypeS...
鱈魚
‧
2021-09-26
在上一篇的內容中，已經介紹到了該如何寫一個組件並完成應用了，現在再繼續進入更深一點的運用吧~對於 Vue 的實體來說，我們稱之為 父組件，而在裡面所使用的稱之為...
承上篇，談到 v-for，就要說說它的最佳良伴——key。 v-for 必須綁定代表唯一值的 key 若未綁定 key 值，Terminal 會直接報錯，表示「...
當我們有時候某個功能的重複運用性較高，但每次都還要再寫一個一模一樣的功能，是不是很麻煩呢?那麼這時我們就可以好好利用 Vue 組件的功能，可以讓我們只寫一次，就...
目前為止，我們成功引入了 BootstrapVue 的元件 Navbar，也調整了樣式和內容。 突然發現少放了一個重要項目，於是趕緊補上一個 <b-nav...
本系列文已改編成書「Arduino 自造趣：結合 JavaScript x Vue x Phaser 輕鬆打造個人遊戲機」，本書改用 Vue3 與 TypeS...
鱈魚
‧
2021-09-24
成功渲染出 BootstrapVue Navbar 元件之後，接著來將預設樣式改成自己喜歡的專案色調和排版吧！依據文件介紹，我們可以利用修改 property...
讓我們接續昨天的模板語法介紹吧，昨天講了v-once跟v-html，今天來說說屬性跟JavaScript 表達式! Attribute Mustache語法不能...
本系列文已改編成書「Arduino 自造趣：結合 JavaScript x Vue x Phaser 輕鬆打造個人遊戲機」，本書改用 Vue3 與 TypeS...
鱈魚
‧
2021-09-23
雖然之前提過的 計算屬性 computed，就有監聽的功能了，不過有時候我們仍需要一個屬於自己定義的監聽器，這時就可以使用到 watch 這個更通用的方法了~點...
day-14 我們說明了 , 如何將 Vue 的 Component 轉換成 Web Component day-17 說明了 , 如何在 React 專案中...
上篇透過簡單的 vue add 指令就完成了 BootstrapVue 安裝和引入，其引入 bootstrap-vue plugin 的方式其實是備妥所有 Bo...
除了資料的操作， Vue 也還可以跟 網頁樣式 有關係，除了內容可以用 v-if 做切換，擁有會員資格的是不是也可以讓它的介面更華麗呢? 趕快來看看~ v-bi...
昨天我們講到了Vue的實體還有實體內會有的一些物件，今天就來用範例看看它內外互相響應的過程吧٩(ˊᗜˋ )و 數據和方法 當Vue實例被創建時，它會將data中...
本篇開始終於要進入解決需求的前置作業了！首先需要讓網站有個基本的置頂導覽列，讓我們有請 BootstrapVue 出場～直接交給 BootstrapVue 幫你...
本系列文已改編成書「Arduino 自造趣：結合 JavaScript x Vue x Phaser 輕鬆打造個人遊戲機」，本書改用 Vue3 與 TypeS...
鱈魚
‧
2021-09-21
Vue 裡面的事件處理，使用的方式會跟一般 JavaScript 的用法相近，下面跟著一起看吧~ 事件處理 v-on 使用的方式為 例1.<button...
當我們拿到一個現有的 Web Component 時 , 如果直接在 Vue 專案中使用會抱錯 今天來解決這個 issue 吧 ! 利用 vue-cli...
gior__ann
Teen
ㄆㄩ
Tree
iThome鐵人賽
看影片追技術