iT邦幫忙

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

技術 Day 08:深仍可測的元件樣式-Deep Selectors

成功渲染出 BootstrapVue Navbar 元件之後,接著來將預設樣式改成自己喜歡的專案色調和排版吧!依據文件介紹,我們可以利用修改 property...

鐵人賽 Modern Web DAY 8
Vue.js 進階心法 系列 第 8

技術 Component 鬼牌(一): 看 props 決定 Component

鬼牌,在此借用的意思是「可以成為任何一張牌」 Dynamic Components 可以當鬼牌 Dynamic Components 技術使用 <comp...

鐵人賽 Modern Web DAY 14

技術 [前端暴龍機,Vue2.x 進化 Vue3 ] Day14.監聽器

雖然之前提過的 計算屬性 computed,就有監聽的功能了,不過有時候我們仍需要一個屬於自己定義的監聽器,這時就可以使用到 watch 這個更通用的方法了~點...

鐵人賽 Modern Web DAY 22

技術 Day 22:「您好,歡迎登入 Vuta 奇幻世界」- 事件處理

「燈愣~」 (以下為系統登入事件的自動通知) 「您好,兔兔」「歡迎登入 Vuta 奇幻世界」 咦 ...?系統登入事件?摁,我昨天是有登入沒錯。 「燈愣~」...

鐵人賽 Modern Web DAY 23

技術 [重構倒數第08天] - 圖片瘦身與靜態資源gzip優化

前言 該系列是為了讓看過Vue官方文件或學過Vue但是卻不知道怎麼下手去重構現在有的網站而去規畫的系列文章,在這邊整理了許多我自己使用Vue重構很多網站的經驗...

鐵人賽 Modern Web DAY 11

技術 Day 11. Money money Vue的$$哪裡來-數據和方法

昨天我們講到了Vue的實體還有實體內會有的一些物件,今天就來用範例看看它內外互相響應的過程吧٩(ˊᗜˋ )و 數據和方法 當Vue實例被創建時,它會將data中...

鐵人賽 Modern Web DAY 8

技術 [Day08] Storybook - 基本介紹 & 安裝

Credit: https://www.behance.net/gallery/35988339/Style-guide-e-commerce-web-app...

鐵人賽 Modern Web DAY 7

技術 [Day 7]想不到有梗的標題LA(前端篇)

沒有想到連假結束後的第一天就要冨樫了...,我工作的公司在新加坡,而我在台灣full remote,我們中秋放連假而新加坡那邊沒放假,導致一開工就滿多事情要處理...

鐵人賽 Modern Web DAY 22

技術 [30天 Vue學好學滿 DAY22] Vue Router-1

Vue 官方所提供的路由,由於使用vue2,Vue Router 版本選擇v3。 安裝 // npm npm install vue-router 應用 新...

鐵人賽 Modern Web DAY 21

技術 Day 21:「爸爸說,家裡要重新裝潢了」- 關於樣式的屬性綁定講解

兔女鵝:「爸爸,兔兔昨天講的好難」「有一大堆東西要記起來,要學不動了 QQ」 兔跋:「一定是家裡的裝潢太壓抑,要換!」 兔女鵝:「不是,爸爸...應該跟裝潢沒...

鐵人賽 Modern Web DAY 13

達標好文 技術 不只懂 Vue 語法:如何透過路由實現跨頁面傳遞資料?

問題回答 在跳轉頁面時,可以透過路由物件裏 params 或 query 來傳遞資料,也可以使用各種不同模式的 Route props 來傳遞資料。前者需要依賴...

鐵人賽 Modern Web DAY 7
Vue.js 進階心法 系列 第 7

技術 用 watch 搭配服用 immutable

在 《Clean Architecture》裡第 6 章介紹 functional programming ,有提到一個很重要的觀念 - 不可變動性 (immu...

鐵人賽 Modern Web DAY 13

技術 [前端暴龍機,Vue2.x 進化 Vue3 ] Day13.Class 與 Style 綁定

除了資料的操作, Vue 也還可以跟 網頁樣式 有關係,除了內容可以用 v-if 做切換,擁有會員資格的是不是也可以讓它的介面更華麗呢? 趕快來看看~ v-bi...

鐵人賽 自我挑戰組 DAY 22

技術 Day22 - Ajax 加上 Antiforgery Token (二)

Case01 與 Day21 重點差異的部份: Controller 內 Action: 加上 ValidateAntiForgeryToken Attri...

鐵人賽 Modern Web DAY 7

技術 [Day07] Vue i18n - Datetime Formatting

在本地化 (localize) 專案時,我們可能會遇到需要處理日期時間顯示的問題,因為日期時間的顯示方式可能會因為每個國家而有所不同,例如: <p>...

鐵人賽 Modern Web DAY 22

技術 [重構倒數第09天] - Vue-Cli + PurgeCSS 刪除你用不到的CSS

前言 該系列是為了讓看過Vue官方文件或學過Vue但是卻不知道怎麼下手去重構現在有的網站而去規畫的系列文章,在這邊整理了許多我自己使用Vue重構很多網站的經驗...

鐵人賽 Modern Web DAY 21

技術 [30天 Vue學好學滿 DAY21] Vuex-4

Action 類似於mutation     action -> mutation -> 改變狀態 vs 直接提交mutation -> 改變...

鐵人賽 自我挑戰組 DAY 21

技術 Day21 - 輕前端 Vue - 動態 新增/刪除 Collection 項目(四)

Case01 與 Day20 重點差異的部份: Controller 內 Action: [HttpGet] public IActionResult Ca...

鐵人賽 Modern Web DAY 12

技術 不只懂 Vue 語法:如何用 event bus 或 mitt 實現跨元件傳遞資料?

問題回答 所謂跨元件,即是兩個元件並無父子關係,並沒有被對方包著。如果要互相傳遞資料,可以使用 mitt(在 Vue 2 是 event bus)、Vuex 或...

鐵人賽 Modern Web DAY 12

技術 [前端暴龍機,Vue2.x 進化 Vue3 ] Day12.事件處理

Vue 裡面的事件處理,使用的方式會跟一般 JavaScript 的用法相近,下面跟著一起看吧~ 事件處理 v-on 使用的方式為 例1.<button...

鐵人賽 Modern Web DAY 20

技術 Day 20:「資料拿來我就幫你改」- Vue 基礎觀念及常用語法

嘿~昨天的內容還行嗎? 「兔兔,昨天突然就接收到大量語法!」 齁,這個我就要說聲不好意思~原本是應該先介紹基本觀念,但我們今天基本觀念要寫在 SFC 裡面練習...

鐵人賽 Modern Web DAY 7
30天肝出購物網站 系列 第 7

技術 Day07:07 - User服務(2) - 前端 - 註冊、登入、JS正則表達式

Hi,Привет,我是Charlie! 在Day06當中,我們完成了後端的基本註冊、登入,在今天我們要完成前端的註冊跟登入囉。 ===============...

鐵人賽 Modern Web DAY 6

技術 [Day06] Vue i18n - Number Formatting (Currency 貨幣)

在本地化 (localize) 專案時,我們可能會遇到需要處理金錢、價錢等貨幣的問題,在顯示價錢時我們會需要依據當前的語系顯示相對應的貨幣符號 ,例如: &lt...

鐵人賽 Modern Web DAY 21

技術 [重構倒數第10天] - 行動裝置上面的 Touch 跟 Click

前言 該系列是為了讓看過Vue官方文件或學過Vue但是卻不知道怎麼下手去重構現在有的網站而去規畫的系列文章,在這邊整理了許多我自己使用Vue重構很多網站的經驗...

鐵人賽 Modern Web DAY 6
Vue.js 進階心法 系列 第 6

技術 深入淺出 Computed

Vue.js 的自我介紹中,只有說自己接近 MVVM 但不是嚴格的 MVVM。 我覺得只要會「自動更新畫面」就算是有 MVVM 的效果至於有沒有達到 MVVM...

鐵人賽 Modern Web DAY 19

技術 Day 19:「通通拿去做雞精啦!」- Vue SFC

嗨大家~昨天有沒有試著用 Creator 建立專案呢! 沒有的話現在趕快去複習哦,因為我們今天會用到~ 之前有說過 Vue 是漸進式的,所以你用多用少都可以,...

鐵人賽 Modern Web DAY 20

技術 [30天 Vue學好學滿 DAY20] Vuex-3

Mutation 提交mutation,是更動state的唯一方法,並以state為第一個參數。包含事件類型(type)、回調函數(handler),不可直接調...

鐵人賽 Modern Web DAY 11

技術 [前端暴龍機,Vue2.x 進化 Vue3 ] Day11.列表渲染

當我們有很多重復的架構,內容卻不一樣,以舊有無框架的開發,我們可能就需要手動一筆一筆的刻出來,更進步一點,會透過複製+貼上~再來更改內容(像是成績單,訂單,或者...

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

技術 Day 05:簡寫好用一直用-v-on、v-bind

延續上篇最後提到 Webpack 設置了別名「@」來取代路徑「/src」,然而在模版語法中,「@」則是另外的用途,因此一開始先分辨清楚各自的定義,之後就能運用自...

鐵人賽 Modern Web DAY 11

技術 不只懂 Vue 語法:如何使用 v-model 實現父子元件傳遞資料?

問題回答 所謂父子元件傳遞資料,就是透過使用 props 和 emits 來完成。而 v-model 只是結合使用 props 和 emits 的語法糖。例如在...