iT邦幫忙

vue.js相關文章
共有 1664 則文章
鐵人賽 Modern Web DAY 13
用範例理解 Vue.js 系列 第 13

技術 用範例理解 Vue.js #13:v-model and data binding

你可以用 v-model 指令建立雙向數據綁定,在 Day2 的範例 06 - Form Input Bindings 已經使用過了。 範例回顧 Day2:...

鐵人賽 Modern Web DAY 3

技術 不只懂 Vue 語法:以 Vue 和 Nuxt 為例,說明 SPA 和 SSR 的概念?

問題回答 Vue 是 SPA 框架,而 Nuxt 是 Vue 生態系裏的一個能同時實現 SPA 和 SSR 的框架。SPA 的主要技術是不用重刷頁面來更新頁面內...

跟 VueJS 認識的30天 系列 第 12

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

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

鐵人賽 Modern Web DAY 4

技術 vue & vuex 04 - 使用 vue-router 建構 Single Page Application

為什麼要使用 router ? 更方便讓我們切換兩個不同的頁面,而不是將所有功能寫在同一頁上面,利用 if 去切換 使用 vue-router 2.0 npm...

鐵人賽 Modern Web DAY 12
用範例理解 Vue.js 系列 第 12

技術 用範例理解 Vue.js #12:Event Handling(v-on)

Event Handling 可以用 v-on 指令監聽 DOM 事件,並在觸發時執行一些 JavaScript 代碼。 v-on 當 button Gree...

鐵人賽 Modern Web DAY 11
Nuxt 3 學習筆記 系列 第 11

技術 [Day 11] Nuxt 3 插件 (Plugins)

🔥【Vue.js → Nuxt 入門推薦!🌟 新書即將上市 🌟】📘《想要 SSR 嗎?就使用 Nuxt 吧!Nuxt 讓 Vue.js 更好處理 SEO 搜...

技術 vue 學習雜記 (六)

在js数据中如何引用图片 data () { return { imgUrl: '图片地址',//错误写法...

鐵人賽 Modern Web DAY 5

技術 Day 05 安裝 Tailwind CSS

上一篇的範例因為沒有用 CSS 調教過,還不大能見人。本篇將來簡單介紹 Tailwind CSS 這個 Utility-First 的 CSS 框架。 Tai...

鐵人賽 Modern Web DAY 10
Nuxt 3 學習筆記 系列 第 10

技術 [Day 10] Nuxt 3 組合式函式 (Composables)

🔥【Vue.js → Nuxt 入門推薦!🌟 新書即將上市 🌟】📘《想要 SSR 嗎?就使用 Nuxt 吧!Nuxt 讓 Vue.js 更好處理 SEO 搜...

鐵人賽 Modern Web DAY 10

技術 [ Vue.js ] 元件樣板 template

學習完 Vue 之後,想要透過單元測試守護你的專案,但又不知道從何起手?別擔心,快來訂閱作者最新系列文 《小白也能輕鬆瞭解的 Vue3 單元測試!》讓你的 V...

鐵人賽 Modern Web DAY 25
Nuxt 3 學習筆記 系列 第 25

技術 [Day 25] Nuxt 3 邁向國際化 - 使用 Nuxt I18n 實作多國語系

🔥【Vue.js → Nuxt 入門推薦!🌟 新書即將上市 🌟】📘《想要 SSR 嗎?就使用 Nuxt 吧!Nuxt 讓 Vue.js 更好處理 SEO 搜...

鐵人賽 Modern Web DAY 22
Vue.js套件介紹及範例 系列 第 22

技術 vue-tables-2 (3)

vue-tables-2 (3) 表格套件,本篇主要說明如何在Template裡面使用自訂元件(Custom component)取代表格的顯示資料 Git...

技術 Electron - 今晚我想來點 Electron 加 Vue.js

前幾篇介紹了 Electron 如何操作,既然 Electron 是將網頁包起來,那當然可以使用 Vue.js 來做啊!今天就讓我們一起看看該怎麼實作 Elec...

鐵人賽 Modern Web DAY 24

技術 【D24 - 用Vue實作網頁】一天搞定登入+註冊+登出

昨天我們提到了Firebase 的Authentication~ 今天就會純coding,帶大家走過一遍完整的登入到登出流程! 前言 今天會比較多codin...

鐵人賽 Modern Web DAY 4
用範例理解 Vue.js 系列 第 4

技術 用範例理解 Vue.js #4:Virtual DOM

概述 DOM 是文檔對像模型(Document Object Model)的簡寫,在瀏覽器中我們可以使用 js 來操作 DOM,但是這樣的操作性能很差,於是...

鐵人賽 Modern Web DAY 10
VueJS 從前端到後端 系列 第 10

技術 Router 基本入門 Day 9

部落格同步刊登 [IT 鐵人賽] Router 基本入門 Day 9 聊完狀態管理之後,我們來聊一下前端的路由。最近各大家前端工具都有支援前端路由的功能。而...

鐵人賽 Modern Web DAY 6
初探Vue.js 30天 系列 第 6

技術 [Day 6] v-model 雙向綁定-表單資料處理好幫手

v-model 前面講到v-bind是單向綁定,而今天就要來講雙向綁定的v-model(Two-way Binding) v-model常用於表單及元素來做雙向...

鐵人賽 Modern Web DAY 7
用範例理解 Vue.js 系列 第 7

技術 用範例理解 Vue.js #7:Filters vs Computed

Filters Vue.js 允許自定義過濾器,過濾器分為本地和全域。使用方法分為兩種: 模板運算後方加上管道符號| {{ value | filter...

鐵人賽 Modern Web DAY 29
Nuxt 3 學習筆記 系列 第 29

技術 [Day 29] Nuxt 3 發布網站前的建構打包 (Build) 與靜態網站生成 (Static Site Generation)

🔥【Vue.js → Nuxt 入門推薦!🌟 新書即將上市 🌟】📘《想要 SSR 嗎?就使用 Nuxt 吧!Nuxt 讓 Vue.js 更好處理 SEO 搜...

鐵人賽 Modern Web DAY 9
Nuxt 3 學習筆記 系列 第 9

技術 [Day 09] Nuxt 3 元件 (Components)

🔥【Vue.js → Nuxt 入門推薦!🌟 新書即將上市 🌟】📘《想要 SSR 嗎?就使用 Nuxt 吧!Nuxt 讓 Vue.js 更好處理 SEO 搜...

鐵人賽 Modern Web DAY 15

技術 不只懂 Vue 語法:請說明 keep-alive 以及 is 屬性的作用?

問題回答 <keep-alive> 的作用是緩存一個元件的資料狀態,即使它被切換掉,不再呈現在畫面上時,它的資料狀態依然會把存起來,並不會像一般元件...

鐵人賽 Modern Web DAY 16
Nuxt 3 學習筆記 系列 第 16

技術 [Day 16] Nuxt 3 狀態管理 (State Management)

🔥【Vue.js → Nuxt 入門推薦!🌟 新書即將上市 🌟】📘《想要 SSR 嗎?就使用 Nuxt 吧!Nuxt 讓 Vue.js 更好處理 SEO 搜...

鐵人賽 自我挑戰組 DAY 26
前端新手筆記-Vue.js 系列 第 26

技術 Day 26 Vue-router簡介

前言 昨天介紹完Vue CLI2、3如何建立後,我們今天來認識一下Vue-router怎麼使用吧! Vue Router簡介 Vue Router就是由前端模...

技術 [筆記][Vue.js]打開Vue.js世界的大門(3)-既然長得差不多,就用迴圈吧!

終於輪到迴圈了(其實也才剛開始三篇而已XD)!說到迴圈大家一定不陌生,除了最初的起點Hello!world!以外,應該就是九九乘法表了,那當迴圈融入前端框架時,...

鐵人賽 Modern Web DAY 22

技術 不只懂 Vue 語法:為何 v-for 的 key 必須是唯一值?v-for 與 v-if 能否同時使用?

問題回答 v-for 的 key 必須是唯一值,才可以讓 Vue 在更新 v-for 所產生的列表時,能準確更新節點。相反,如果使用 index 作為 key,...

技術 用前端就可以充當機器人寄信 -- EmailJS

EmailJS helps sending emails using client side technologies only. No server is...

鐵人賽 Modern Web DAY 13
Nuxt 3 學習筆記 系列 第 13

技術 [Day 13] Nuxt 3 中間件目錄 (Middleware Directory)

🔥【Vue.js → Nuxt 入門推薦!🌟 新書即將上市 🌟】📘《想要 SSR 嗎?就使用 Nuxt 吧!Nuxt 讓 Vue.js 更好處理 SEO 搜...

鐵人賽 Modern Web DAY 3

技術 真的好想離開 Vue 3 新手村 - Day 3: 細看 Vue + Vite 專案資料夾結構

誰適合看這篇 已經初步了解 npm、package.json、package-lock.json、node_modules 建立 Vue 專案後,沒有仔細看...

鐵人賽 Modern Web DAY 28

技術 不只懂 Vue 語法:試說明有哪些方式可以全域註冊方法?

問題回答 全域註冊的方法,意思是每個 Vue 元件都能使用的方法。在 Vue 2 會有以下方法: Vue.prototype plugin mixin...

鐵人賽 Modern Web DAY 19
Nuxt 3 學習筆記 系列 第 19

技術 [Day 19] Nuxt 3 串接 Google OAuth 登入

🔥【Vue.js → Nuxt 入門推薦!🌟 新書即將上市 🌟】📘《想要 SSR 嗎?就使用 Nuxt 吧!Nuxt 讓 Vue.js 更好處理 SEO 搜...