iT邦幫忙

vue相關文章
共有 801 則文章
鐵人賽 Modern Web DAY 11

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

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

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

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

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

鐵人賽 Software Development DAY 6

技術 [第六隻羊] 迷霧森林建築工事 V 哈囉世界安安vue

天亮了 昨晚是平安夜 關於迷霧森林故事 Rock you,Rock you,Rock you 敲家門沒人應沒的 Rocky找不到先行離開招集會的父母有點著急沿著...

鐵人賽 Modern Web DAY 10

技術 [前端暴龍機,Vue2.x 進化 Vue3 ] Day10.條件渲染

當我們有區分,在某種條件下看到的會是 A 畫面,某一些條件下看到的會是 B 畫面...的情形,例如每個會員權限不同所可以使用的功能不同就是一個簡單的例子,這時就...

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

技術 Day 04:.vue 檔三層櫃

繼上篇觀察整個專案資料夾結構之後,接著來觀察子層 components 資料夾裡的 HelloWorld.vue 和父層 views 資料夾裡的 Home.vu...

鐵人賽 Modern Web DAY 6

技術 D05 - 準備前端環境:建立 Vue 開發環境

本系列文已改編成書「Arduino 自造趣:結合 JavaScript x Vue x Phaser 輕鬆打造個人遊戲機」,本書改用 Vue3 與 TypeS...

鐵人賽 Modern Web DAY 14

技術 [Day14] 利用 Vue CLI 3 來建立 Web Components 的 JS 檔

前面花了大把的時間 , 來建立跟 Vue 很像的 Web Components 其實 Vue CLI 也有提供建立 web-component 的方法 下方來說...

鐵人賽 Modern Web DAY 9

技術 [前端暴龍機,Vue2.x 進化 Vue3 ] Day9.計算屬性 computed

甚麼是計算屬性? 甚麼時候用計算屬性? 接下來帶大家來看看,也會搭配一些例子~ 甚麼是計算屬性? computed 是 Vue 提供的 計算屬性,它可以幫我們運...

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

技術 Day 03:觀察資料夾

建好專案之後,來看看專案裡已經幫你準備好哪些檔案吧!先大致認識每個資料夾如何分門別類的規則,日後自己在歸檔時也會相對有概念,更方便管理檔案、組織架構。 根目錄層...

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

技術 Day 02:Vue 個專案先

本篇以 Vue CLI 開始這一回合。 Vue CLI 提供快速建置的開發環境,使用者只需透過簡易設定選擇組隊工具,之後再輸入指令便能操作基本的運行功能;如此主...

鐵人賽 Modern Web DAY 8

技術 [前端暴龍機,Vue2.x 進化 Vue3 ] Day8. v-model 修飾符 -- 省下自己寫 JS 處理的時間

v-model 修飾符 Vue 裡面為 v-model 提供了一些可以用的修飾符,主要是可以幫我們限制一些使用者輸入的行為以下透過範例講解每個修飾符幫我們做了甚...

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

技術 Day 01:新手視角

年中才剛攻破 JavaScript 30 挑戰一天一題 JavaScript,過不久因緣際會接了一個專案需要使用框架開發,直接迫使我從 Vanilla.js 新...

鐵人賽 Modern Web DAY 7

技術 [前端暴龍機,Vue2.x 進化 Vue3 ] Day7. Vue資料的使用方式

Vue資料的使用方式 在前一篇中,我們已經會一些用來表示內容的方式了,但僅僅只是呈現~所以今天就會來點互動,主要是透過輸入框、下拉選單...等方式來接收使用者的...

鐵人賽 Modern Web DAY 6

技術 [前端暴龍機,Vue2.x 進化 Vue3 ] Day6. 模板語法

模板語法 在上一篇我們已經完成了我們第一個 Vue 建出來的 Hello Vue 網頁,其中我們有學到一種渲染內容的模板語法 {{ }},那麼今天就再來學學其他...

鐵人賽 Modern Web DAY 2

技術 D01 - 萬事起頭難

本系列文已改編成書「Arduino 自造趣:結合 JavaScript x Vue x Phaser 輕鬆打造個人遊戲機」,本書改用 Vue3 與 TypeS...

鐵人賽 Modern Web DAY 5

技術 [前端暴龍機,Vue2.x 進化 Vue3 ] Day5. Vue的起手開發

接下來,開始看看如何著手進行 Vue 的開發吧這邊都是透過最原始、最簡單的網頁開發模式進行,所以不會介紹到 Cli 的方式~ Hello Vue ,第一個 Vu...

鐵人賽 Modern Web DAY 4

技術 [前端暴龍機,Vue2.x 進化 Vue3 ] Day4. Vue的生命週期

開心,終於正式進入 Vue 的介紹了~在了解 Vue 的寫法前,有個重要的觀念必需去了解,那就是 Vue的生命週期其實我覺得,不管是不是 vue 還是其他的前端...

鐵人賽 Modern Web DAY 1

技術 D00 - 緣起

本系列文已改編成書「Arduino 自造趣:結合 JavaScript x Vue x Phaser 輕鬆打造個人遊戲機」,本書改用 Vue3 與 TypeS...

鐵人賽 Modern Web DAY 3

技術 [前端暴龍機,Vue2.x 進化 Vue3 ] Day3.在認識vue之前(三)

終於~來到了在認識vue之前,我整理的最後一個部份了 會有在認識vue之前的這部份,主要是自己認為可以先搞懂這些特性,後面的應該會更好理解 (應該 XD~這...

鐵人賽 Modern Web DAY 2

技術 [前端暴龍機,Vue2.x 進化 Vue3 ] Day2.在認識vue之前(二)

在認識 Vue 之前,前一篇已經介紹了資料驅動畫面跟雙向綁定的概念了今天再介紹一個 MVVM架構~ 3.MVVM 架構 記得~當初白紙白到連這個都講得哩哩辣辣(...

鐵人賽 Modern Web DAY 1

技術 [前端暴龍機,Vue2.x 進化 Vue3 ] Day1.在認識vue之前(一)

[講古時間]: 回憶過去~ 痛苦的相思忘不了~哈哈,記得剛出社會時,雖然說是張白紙,不過可能太白~ 導致處處碰壁現在就來學學框架,跟著小白一起進化吧~感覺會...

鐵人賽 Modern Web DAY 3

技術 Day 03 | 透過指令建立元件

安裝並部署 Livewire 的步驟沒有很多,照著做不用三分鐘就能完成囉!今天一樣是照著官方文件帶大家做一次囉~ 安裝 Livewire 官方文件 首先要先安裝...

鐵人賽 Modern Web DAY 2

技術 Day 02 | Laravel Livewire 基本介紹

Livewire 是 Laravel 的全端框架,能建立像 Vue 一樣的動態頁面的同時又能保有 Laravel 原有的特性。除此之外在 SEO 方面仍跟原本...

技術 vue定義全域性變數

Global.vue要共用的全域參數 <script> const _token = ""; const userid = &q...

技術 Vue 在 Localhost 開發時出現 “ERR_CONNECTION_REFUSED”、”ERR_CONNECTION_TIMED_OUT” 錯誤的解決方式

我在 Localhost 開發的時候會出現錯誤訊息 GET http://192.168.43.55:8081/sockjs-node/info?t=16281...

技術 Vue 在 Localhost 開發時出現 “[prerender-spa-plugin] Unable to prerender all routes!” 錯誤的解決方式

我在 Localhost 開發的時候會出現一個錯誤訊息困擾有許久,而且是機率性的。因為以 SPA(Single-Page Application) 開發專案項目...

技術 Vue 如何在 LocalHost 開發環境時使用 HTTPS

如果你有 Localhost 開發環境需要以 HTTPS 瀏覽時,可以參考以下方法: 方法一:vue.config.js module.exports = {...

技術 使用 Vue 串接 Facebook Login JavaScript SDK 時 FB.getLoginStatus 總是回應 unknown 狀態,但明明已經登入成功

我在本地 Localhost 串接 Facebook Login JavaScript SDK 的時候,明明已經登入成功,但是重新整理頁面後,又會再次的取得 u...

技術 [ Vue ] 使用 Vitawind 1.2 來 建置 Vite + Tailwind JIT 專案

建立 Vite 專案 在你要放置專案的地方執行這個指令來建立 vue 模板的 vite 專案 # npm 6 npm init vite [專案名稱] --te...

技術 [Vue]ElementUI组件模板之自動完成el-autocomplete

1.原本的input 改為 el-autocomplete並加上 :fetch-suggestions="querySearch" <...