iT邦幫忙

鐵人檔案

2019 iT 邦幫忙鐵人賽
回列表
自我挑戰組

從0開始vue.js的30天學習日誌 系列

實在想不到什麼有趣的題目,藉這個機會給自己一點動力學習新技術(對我自己來說的…),挑戰自己gogo一定要完賽~~~~

鐵人鍊成 | 共 30 篇文章 | 28 人訂閱 訂閱系列文 RSS系列文 團隊這樣母Tom姆熊
DAY 21

21 Vue實例 - (4) watch

watch是一個偵聽器,宣告在裡面的函式命名要跟data或computed的屬性相對應,watch會偵聽指定的資料,一有變動就觸發watch裡的函式。 函式裡可...

2018-11-05 ‧ 由 UT 分享
DAY 22

22 Vue生命週期

Vue實例的生命週期從建立、更新到消滅,這中間會可以執行一些函式,而這些函式叫生命週期函式(lifecycle hooks),可以依情況需要來宣告使用。 附上...

2018-11-06 ‧ 由 UT 分享
DAY 23

23 Vue組件 - Vue component基本用法

預先定義好的component可以包含:html元素(template)、綁定的資料(data)、方法(methods)跟偵聽(watch)....等等,用法很...

2018-11-07 ‧ 由 UT 分享
DAY 24

24 Vue組件 - 注意事項

瀏覽器解析 創建Vue實例時,el的HTML元素會經過瀏覽器接解析在傳回給Vue實例使用,格式不合法的話瀏覽器會直接把他移除掉,如selec tag裡不是放op...

2018-11-08 ‧ 由 UT 分享
DAY 25

25 Vue組件 - 動態切換

當定義好多組組件後,可以透過條件判斷來決定要出現哪種組件,實際在網頁上常用到的例子如tab的切換。 -tab示意圖- 透過Vue的comonent元素加上v-...

2018-11-09 ‧ 由 UT 分享
DAY 26

26 Vue組件 - 組件資料傳遞、組件結合

既然做了這麼多組件,把組件們結合成一個成品是一定要的,組件與組件間的資料溝通使用的是props與$emit,從今推算後的幾天會留在這塊滿長一段時間...(反覆看...

2018-11-10 ‧ 由 UT 分享
DAY 27

27 Vue組件 - props (1)

Vue組件會使用到上層傳來的props,而props屬性是一個陣列裡面包字串,是用來宣告component使用的props: Vue實例使用HTML模板來輸出組...

2018-11-11 ‧ 由 UT 分享
DAY 28

28 Vue組件 - props(2)

上一篇學習使用props接收上層傳來的資料( 字串 ),今天來學習如何動態綁定props: 使用v-bind :動態綁定 <div id="ap...

2018-11-12 ‧ 由 UT 分享
DAY 29

29 Vue組件 - props(3)

當寫了組件需要和他人協作,或者寫的組件越來越多的時候,就可能會用到props驗證規則,當不符合的時候Vue就會提出警告。 這邊範例一樣用寫到膩的counter,...

2018-11-13 ‧ 由 UT 分享
DAY 30

30 Vue組件 - $emit發送自訂事件

Vue組件的props是單向數據流,所以只能從上傳到下,要由下傳到上的話要使用$emit自訂事件,以下範例: <div id="app&quot...

2018-11-14 ‧ 由 UT 分享