本文同步發表於Andy's Blog 前言 昨天認識了Component特性後,我們今天要來介紹Component之間如何傳遞資料 元件溝通方式 元件與元件...
本文同步發表於Andy's Blog 前言 昨天介紹完this.$parent、this.$child方法後,突然想到沒有介紹到.sync這個語法糖。OK,...
前言 昨天介紹完V-for,我們應該對於常見V-for用法有更深入的認識。如:顯示過濾資料,也介紹了使用V-for上需要注意地方,如:不要把V-for跟V-if...
props 的命名及使用 HTML attribute 是大小寫不敏感的,所以必須要注意 prop 的命名跟使用。 命名 可以使用 PascalCase (首...
前言 昨天介紹完Vue CLI2、3如何建立後,我們今天來認識一下Vue-router怎麼使用吧! Vue Router簡介 Vue Router就是由前端模...
本文同步發表於Andy's Blog 前言 今天終於要進入Vue Component單元勒(撒花),而在接下來幾天我們會來慢慢介紹元件的相關內容,那我們就開...
在別人都完成30天鐵人賽的路上,我真的是太難了QQ,我才發現我一個禮拜的產量竟然只有1-2篇,在看文件的時候才發現自己之前練習 Vue 遇到的問題,真的是絕大部...
本文同步刊載於Andy's Blog 前言 昨天我們簡單介紹了Vue的兩種模板語法:分別為插值(Mustache語法)跟指令v-開頭。而今天我們將先介紹V-...
本文同步發表於Andy's Blog 前言 昨天介紹了元件與元件之間的溝通方式:props in,emit out,而我們今天要針對Props操作上細部介紹...
本文同步發表於Andy's Blog 前言 昨天我們將computed、methods()、watch,三個屬性做了一個簡單比較。而今天我們將要介紹另外一個...
模組的命名 一個模組的命名關係到我們是否能快速地知道這個模組的功能是甚麼,同時可以避免跟現有的 HTML 標籤相衝突。 在Vue.js - 风格指南中, com...
本篇文章同時刊載於Andy's Blog 前言 上一篇文章中我們介紹了Vue的生命週期,了解Vue背後是如何把資料渲染到畫面上,也知道如何在不同life h...
遇到問題 在使用 Select 的時候遇到了一個問題是如果我的 Value 想要讓它是 Object 該怎麼做呢?下面的程式碼看起來是可以運作也把 :valu...
遇到問題 想要透過 Input 來篩選 Table 裡面的資料 解決方法 Element UI 很方便直接使用 Vue 的 Scoped slot...
mixin Mixins是為Vue組件分發可重用功能的靈活方法。mixin對象可以包含任何組件選項(生命週期、data、computed、 methods.....
每次寫筆記都在想要怎麼寫得讓大家(包含未來的我)看得懂,所以每次都要寫很久,但好像自己的內容有點太無聊了 XD 。 自定義事件( Custom Events )...
在 Vue 裡面,我們可以使用元件來動態掛載 HTML而元件到底是什麼? 如果以 HTML 來說的話,就會類似像是 Header Content 這樣一個區塊一...
介紹 Vue CLI 是一個基於 Vue.js 進行快速開發的完整系統 通過 @vue/cli 搭建交互式的項目腳手架。 通過 @vue/cli + @vu...
Vue-cli 3 建立開發環境與新增專案 基礎介紹基本上就到一個段落,接下來最後的這幾天會介紹一些 Vue 的生態。首先介紹該如何建立 Vue 的開發環境與新...
本文同步刊載於Andy's Blog 前言 這兩天介紹完Vue第一種元件之間的溝通方式,props in ,emit out,並且針對props使用上也做了...
遇到問題 在做生日的年月日時,因為我們接觸的客群年齡層大概是民國 40~60 年的人,所以希望可以把“年”這個的預設值調整成西元 1971 年、民國 60 年...
Vue cli 3 UI安裝介面 Node 版本要求Vue CLI需要Node.js 8.9或更高版本(推薦8.11.0+)。 使用以下指令進行安裝 np...
Vue:我們透過組件,來模塊化我們的功能。我知道你很好奇,到底如何從根模塊,傳值給組件,使組件可以渲染資料於table中,對吧?如果,仔細觀察昨天的程式碼,你會...
遇到問題 上班時會遇到一些小問題,也透過這樣一點一滴的把自己學的分享給大家,如果有誤歡迎大家指正 Table 欄位裡面文字過長問題 解決方法一 一...
本文同步發表於Andy's Blog 前言 昨天介紹完event bus,那我們今天來了解如何用is動態切換元件 is動態切換元件介紹 用途:最常使用在頁籤...
之前也都沒使用過 watch ,所以趁這個機會好好了解一下它。 如何使用偵聽屬性(watch) 基礎範例 const vm = new Vue({ el:'...
說了那麼多,感覺還是有點模糊~ 沒關係,我可能也差不多 ( 哈哈 所以還是透過實作練習,讓自己更了解,看見那更明朗的天空吧 目標 : 透過串接 API 接收取到...
最近在 youtube 找到一個學習 webpack 很好用的教學影片,所以正努力的學習 webpack 中,一個不小心就太沉迷在新技術的練習了,導致有點忽略...
在 JS 中有監聽器 addeventListener ,而 Vue 也有自己一套 DOM 元素監聽器的指令 v-on , Vue 也配置了幾個修飾符來替代像是...
Vue extend 當我們有數個元件的內容很相近,只有少部分內容不一樣的時候,我們可以使用 extend 來建立重複的部分,來看下面範例: <div i...