iT邦幫忙

vue相關文章
共有 669 則文章

技術 [鼠年全馬] W36 - Vue出一個旅館預約平台(10)

轉眼間來到了 Vue出旅館預約平台 第10篇了...做的真久阿...還好不是公司的專案, 不然絕對被電爆 這週要來做預約成功的畫面~ #預約成功-開發 先來比...

跟 VueJS 認識的30天 系列 第 13

技術 [DAY13] 跟 Vue.js 認識的30天 - Vue 模組自定義事件(Custom Events)

每次寫筆記都在想要怎麼寫得讓大家(包含未來的我)看得懂,所以每次都要寫很久,但好像自己的內容有點太無聊了 XD 。 自定義事件( Custom Events )...

技術 Vuex 是什麼

Vuex 是 Vue 提供的一種資料狀態管理的模式,它可以統一控管資料的狀態,都是在小型的 SPA 網站,元件資料的傳遞可以透過 props ,但如果是大型的...

技術 [鼠年全馬] W35 - Vue出一個旅館預約平台(9)

這週很重要~要來寫旅館預約平台的 [預約功能] 在F2E API中有提供一個 [POST] 預約房型 方法: 我們要利用它來做預約的功能 #呼叫API方式 呼...

跟 VueJS 認識的30天 系列 第 12

技術 [DAY12]跟 Vue.js 認識的30天 - Vue 模組資料傳遞(`props`)

props 的命名及使用 HTML attribute 是大小寫不敏感的,所以必須要注意 prop 的命名跟使用。 命名 可以使用 PascalCase (首...

技術 [鼠年全馬] W34 - Vue出一個旅館預約平台(8)

這週要來將 [預約頁面] 最後的 房間詳細資訊 完成!! [標題] (已完成) [預約功能] (已完成) [房間詳細] [Footer] (已完成)...

技術 [鼠年全馬] W33 - Vue出一個旅館預約平台(7)

這週繼續來做 [預約頁面] 回顧一下上週切的區塊 [標題] (已完成) [預約功能] [房間詳細] [Footer] (已完成) 這週來處理...

跟 VueJS 認識的30天 系列 第 11

技術 [DAY11]跟 Vue.js 認識的30天 - Vue 的模組註冊(`component`)

模組的命名 一個模組的命名關係到我們是否能快速地知道這個模組的功能是甚麼,同時可以避免跟現有的 HTML 標籤相衝突。 在Vue.js - 风格指南中, com...

技術 [鼠年全馬] W32 - Vue出一個旅館預約平台(6)

因為上個月直接專注在 [iT邦鐵人賽]直接好幾個禮拜都沒有刷 [鼠年全馬] 進度xD 這週回歸來做我們美美的旅館預約平台 #複習 來複習一下目前的進度 V...

鐵人賽 自我挑戰組 DAY 30
每天來點 Vue.js 吧 系列 第 30

技術 每天來點 Vue.js 吧 目錄&總結

tags: Vuejs 本次鐵人作為進入 Vue 3 的前的粗淺回顧,簡單介紹了 Vue 2 官網的內容,雖然有許多不足,中段開始時間調控上做的也不如預期,但在...

鐵人賽 Modern Web DAY 30

技術 [VR 前後端交響曲Day30] Rails專案開發 - 網站部署 + 完賽感言

今天就是網站部署、公開上線的日子了! 不過,因為現在只是最小可行產品而已,還有很多預計規劃的功能還沒完成(例如column component的CRUD),所以...

鐵人賽 自我挑戰組 DAY 29
每天來點 Vue.js 吧 系列 第 29

技術 Vue 動態組件

tags: Vuejs 動態組件 ✐ 動態組件可以幫助我們動態切換組件,例如在網頁的多標籤介面中常見到動態切換組件的需求,便是動態組件能幫忙的場景之一。 使用...

鐵人賽 Modern Web DAY 29

技術 Day 29: 實作 Vue 的 Server Side Render

這篇的程式碼在 https://github.com/DanSnow/ironman-2020/tree/master/static-site-generat...

鐵人賽 自我挑戰組 DAY 30
與Vue相遇 系列 第 30

技術 Day030-與Vue相遇--鐵人賽回顧

回顧30天,也讓我回憶了今年從金融業被抓去做開發工程師的日子。這30天中,講述了Vue的基本介紹、性能比較,也依據Vue的特性, 實作出許多app。 當然,雖...

鐵人賽 Modern Web DAY 29

技術 [VR 前後端交響曲Day29] Rails專案開發 - Action Cable即時互動功能: 以edit和delete ticket為例

來到倒數第二天啦!感動流淚O_Q 前兩天裡用Vuex狀態管理的方式實作編輯和刪除ticket 本日待實作的功能:利用Action Cable廣播,在任何的瀏覽器...

鐵人賽 自我挑戰組 DAY 28
每天來點 Vue.js 吧 系列 第 28

技術 Vue slot:作用域插槽、具名插槽的縮寫

tags: Vuejs 作用域插槽 <slot> 內容在父模板編譯,基於 Vue 的定義,在父模板中編譯的內容訪問 parent scope,在子模...

鐵人賽 Modern Web DAY 28

技術 Day 28: 介紹 Vue 的 Server Side Render

雖然一開始說 Vue 因為有 Single File Component ,所以要 Server Side Render 可能會碰到需要用 bundler 的情...

鐵人賽 自我挑戰組 DAY 4
跟 VueJS 認識的30天 系列 第 10

技術 [DAY10]跟 Vue.js 認識的30天 - Vue 的基本模組(`component`)概念

Vue 的模組 - component 作用 Vue 的模組 component 是可以重複使用的 Vue 實例,所以也擁有 data、computed、wa...

鐵人賽 自我挑戰組 DAY 29
與Vue相遇 系列 第 29

技術 Day029-透過Vuex-實作簡易部落格-打包你的專案吧!

Vue:還記得第10天時,我們才剛認識Vue CLI,但你還記得我的介面嗎? 接著,我們試試看這個指令: npm run build 如此,產生的資料即打包嚕...

鐵人賽 Modern Web DAY 28

技術 [VR 前後端交響曲Day28] Rails專案開發 - 刪除ticket (使用vuex狀態管理)

CRUD新增、刪除、修改、顯示功能是一個完整的線上系統不可或缺的功能。昨天我們完成了更新 ticket,以及介紹了dispatch讓Vue可以聯絡到Vuex的a...

鐵人賽 自我挑戰組 DAY 27
每天來點 Vue.js 吧 系列 第 27

技術 Vue slot: 具名插槽

tags: Vuejs 具名插槽 ✐ 若是需要多個插槽,可以在 <slot> 中使用 name attribute,定義命名的插槽,可以定義具有多個...

鐵人賽 自我挑戰組 DAY 28
與Vue相遇 系列 第 28

技術 Day028-透過Vuex-實作簡易部落格-修改文章

Vue:實做部落格最後一步驟,就是修改文章!上一篇已經了解如何將id生成,如此才可以做個別文章上的操作。原先,在Article頁面上,我們可以加上一個標示,讓文...

鐵人賽 Modern Web DAY 27

技術 [VR 前後端交響曲Day27] Rails專案開發 - 編輯ticket (使用vuex狀態管理)

前情提要:前天我們完成了新增ticket,昨天也順便介紹了v-if語法;今天就延續著前兩天的tempo~~,介紹以Vue.js實作CRUD裡的編輯功能! Ste...

鐵人賽 自我挑戰組 DAY 26
每天來點 Vue.js 吧 系列 第 26

技術 Vue slot:編譯作用域、後備內容

tags: Vuejs <slot> 是什麼? ✐ Vue 中的 <slot> 是 Vue 內置的組件 build-in compone...

鐵人賽 自我挑戰組 DAY 27
與Vue相遇 系列 第 27

技術 Day027-透過Vuex-實作簡易部落格-列舉及刪除文章

Vue:昨日,我們已將文章新增實做出來了!現在只要將文章列舉在首頁,只需要使用之前學到的v-for迴圈,即可完成!透過 v-for,將vuex中state的ar...

鐵人賽 Modern Web DAY 26

技術 [Vue2Leaflet系列二] Leaflet Plugins with Vue

本系列文章已出版實體書籍:「你的地圖會說話?WebGIS 與 JavaScript 的情感交織」(博碩文化)WebGIS啟蒙首選✖五家地圖API✖近百個程式範...

鐵人賽 Modern Web DAY 26

技術 [VR 前後端交響曲Day26] Rails專案開發 - 新增ticket(v-if語法介紹)

昨天鐵人賽做完了新增ticket!所以現在專案裡,Done欄位完成了三張票~ 不過,在繼續實作編輯及刪除ticket功能之前,昨天的完成品有個地方我還不太滿意...

鐵人賽 自我挑戰組 DAY 25
每天來點 Vue.js 吧 系列 第 25

技術 Vue 透過 `$listeners` 在子組件特定元素上監聽原生事件

tags: Vuejs 監聽子組件原生事件 ✐ 當父組件需要接收子組件訊息、數據時,可以透過在子組件 自定義事件 達成,除此之外若是需要監聽子組件 根元素 原生...

鐵人賽 自我挑戰組 DAY 26
與Vue相遇 系列 第 26

技術 Day026-透過Vuex-實作簡易部落格-新增文章

Vue:文章為本專案的共用資料。當許多頁面都需要用到時,這個時候使用Vuex就是最佳時機。下圖,可以看到,在其中一個元件下(Add-Article元件)新增文章...

鐵人賽 Modern Web DAY 25

技術 [VR 前後端交響曲Day25] Rails專案開發 - 新增ticket

盤點這一週的完成項目: 我們現在學會了: 把Rails專案裡會重複使用的部分改寫成Vue 元件(column, ticket) 使用Vue套件Vue drag...