iT邦幫忙

quasar相關文章
共有 22 則文章
鐵人賽 Modern Web DAY 29

技術 [Day 29] Vue Quasar 多國語系 I18n

今天來談談多國語系I18n,能夠讓你輕鬆將網站的內容替換成其他語言。 那為什麼叫做I18n這個奇怪的名字? 其實就是Internationalization的,...

鐵人賽 Modern Web DAY 23

技術 [Day 23] Vue Quasar 彈跳視窗 3 - Modal

眾所週知的彈跳視窗 Modal Modal 看到這個名字,有玩過Bootstarp的同學應該都不陌生,沒錯就是以前的那個modal啦,在Quasar有這麼多彈跳...

鐵人賽 Modern Web DAY 22

技術 [Day 22] Vue Quasar 彈跳視窗 2 - Dialog

就用這個取代傳統alert吧 Dialog Quasar的dialog也是做得跟手機原生的很像,一樣也是material及iOS兩種風格喔。基本上裡面除了放文字...

鐵人賽 Modern Web DAY 21

技術 [Day 21] Vue Quasar 彈跳視窗 1 - Action Sheet

下方的彈出選單 Action Sheet Action Sheet 這是一個從螢幕下方彈跳出小選單的元件 在Android及iOS上也都有類似的原生元件 不過如...

鐵人賽 Modern Web DAY 20

技術 [Day 20] Vue Quasar 表單元件 9 - Knob (旋轉鈕?)

不知不覺就20天啦,感覺又回到了國高中的年代,每天都有作業要寫~有時候下班累得要死,還是要趕一篇出來 xD。文章寫到這個階段,整個框架的元件也都快介紹完了呢,不...

鐵人賽 Modern Web DAY 19

技術 [Day 19] Vue Quasar 表單元件 8 - Editor (文章編輯)

內建的文章編輯器 Editor Editor (WYSIWYG) 有些後台需要讓使用者編輯文章,原本都會有點頭痛,又要去找插件來放了~~好在他也有內建的文章編輯...

鐵人賽 Modern Web DAY 18

技術 [Day 18] Vue Quasar 表單元件 7 - Datetime

輕鬆變出時間日期輸入框Datetime 今天有一個表單要給使用者輸入基本資料 填著填著就來到了生日的欄位 這時候為了怕使用者格式亂填 在過去我們會去找datep...

鐵人賽 Modern Web DAY 17

技術 [Day 17] Vue Quasar 表單元件 7 - Option Group

選項元件直接打包一次做好Option Group Option Group 有時候要做一堆選項,是不是覺得要複製一大堆radio、checkbox很煩呢,所以我...

鐵人賽 Modern Web DAY 14

技術 [Day 14] Vue Quasar 表單元件 3 - Radio

簡單的單選元件 Radio Radio Quasar的Radio元件跟其他表單輸入元件的基本屬性都大同小異 一樣也可以用QFiled把它包裝起來哦 引入元件 f...

鐵人賽 Modern Web DAY 13

技術 [Day 13] Vue Quasar 表單元件 2 - Chips Input

輸入陣列的好幫手 Chips Input Chips Input 是不是有些時候建立使用者表單輸入時,會有能填多種值的欄位,像是興趣、職業等等。 但是又怕使用...

鐵人賽 Modern Web DAY 12

技術 [Day 12] Vue Quasar 表單元件 1 - Field

序 大家好,這篇開始就開始來談後端表單常用到的元件吧~ 原本的旅遊系列再來的頁面都是以layout為主 但是quasar的layout元件也差不多介紹完了 才發...

鐵人賽 Modern Web DAY 11

技術 [Day 11] Vue Quasar 打造 旅遊網站系列 7 - Parallax、Breadcrumbs、Rating

GitHub Demo 今天完成後的畫面 首頁部分已經差不多了 剩下頁尾以及一些小區塊 因為元件都跟之前的文章有重複到 故在這邊就不實作會功能重複的區塊了 製...

鐵人賽 Modern Web DAY 10

技術 [Day 10] Vue Quasar 打造 旅遊網站系列 6 - Cards (卡片)

GitHub Demo 今日完成的畫面 首頁的第一個區塊做完了 今天就來做第二個區塊吧 先看看兩大家的頁面 這種卡片形式的元件,咱們Quasar也有 我...

鐵人賽 Modern Web DAY 9

技術 [Day 9] Vue Quasar 打造 旅遊網站系列 5- Popover (彈出視窗)

今天做完我們的頁面會長這樣~ 今天一樣接續昨天的部分~ 我們來做搜尋點擊但是還沒輸入時下面出現的視窗 KLOOK 的視窗雖然有圖片美觀,本來也想做像這種...

鐵人賽 Modern Web DAY 8

技術 [Day 8] Vue Quasar 打造 旅遊網站系列 4 - Input、Autocomplete

今日做完後會長這樣 繼續昨天的進度 該補上搜尋的框框了 先來看一下其他兩家的東西 恩... 不簡單啊 XD? 暫且不看下面的視覺選單 先來打個字搜尋看看...

鐵人賽 Modern Web DAY 7

技術 [Day 7] Vue Quasar 打造 旅遊網站系列 3 - Carousel (頁面輪播)

今天就來做我們的首頁吧 ~!! ?? 其他兩家的首頁 基本上都是圖片輪播的形式 加上一個輸入匡來搜尋目的地 那我們今天就來做這個輪播功能吧 建立新的首頁 由於...

鐵人賽 Modern Web DAY 6

技術 [Day 6] Vue Quasar 打造 旅遊網站系列 2 - List & ListItem

昨天已經將Header做好了 今天就接著昨天的進度吧~ 還記得昨天將header上的按鈕設定為 gt-xs 嗎 因為手機頁面沒辦法在上方的toolbar顯示這麼...

鐵人賽 Modern Web DAY 5

技術 [Day 5] Vue Quasar 打造 旅遊網站系列 1 - Header

本篇演示項目 Toolbar ToolbarTitle Button 這幾天都在想要演示什麼主題會比較好 想一想最近突然好想要出去玩 那就乾脆來做旅遊網站好...

鐵人賽 Modern Web DAY 4

技術 [Day 4] Vue Quasar Framework 頁面Layout介紹

今天就讓我們直接開始吧~! 前面幾天我們有執行過部署的指令了 不過我們這邊再複習一下 $ quasar init helloworld $ cd hellow...

鐵人賽 Modern Web DAY 3

技術 [Day 3] Vue Quasar Framework 淺述設定檔 quasar.conf.js

今天就來徹底分析Quasar的設定檔quasar.conf.js 為了方便瀏覽,我們把它拆成各個區塊來講講 不多說就直接開始吧 plugins: [...

鐵人賽 Modern Web DAY 2

技術 [Day 2] Vue Quasar Framework 環境佈署

安裝 昨天安裝完 今天就直接來佈署環境囉 ~ ! $ quasar init <folder name> 接下來會有介面要來引導你安裝 Proje...

鐵人賽 Modern Web DAY 1

技術 [Day 1] Vue Quasar Framework介紹與安裝

Quasar 是一款基於Vue.js開發的UI Framework。可以讓你輕鬆就搞定網站介面之餘還不失美觀,更重要的是他還能讓你輕鬆就做好RWD,除此之外還能...