VueJS

[IT 鐵人賽] Vanilla JS 與 Vue 的生命週期 Day 28

最後幾天來聊一下關於生命週期的事情,這裡提到的生命週期並不限於 Vue 所屬的區域,也包含了一些原生 JavaScript 那種無關 Bug 而是一種 Feature 的那些 生命週期 的事情。 沒有被 JS 婊過就不算寫過 JS 你說是吧( 並沒有這種說法好嗎 ) 關於封裝與執行 我之前犯過幾個低級錯誤,舉個例子給大家看個笑話: <template> <section class="hello"> <

  • Hina Chen
    Hina Chen
5 min read
VueJS

[IT 鐵人賽] 動態載入 Components Day 21

我們又回到動態載入系列了,如果覺得我很煩的話可以先行離席沒關係。由於我昨天整理 Dockfile 的時候有點過於厭世,所以今天我這邊一樣會帶入一些昨天的結構,至於說 Dockfile 的話還沒好,如果想要先看結構的,可以先去我的 Github 上面看。 ITHome Ironman 2019 Hybrid App 混合模式的動態載入 其實我比較偷懶,上面的例子我直接掃全部的資料夾,然後將檔案加入樣版中。不過這個將來一定會 壞調 壞掉,所以小朋友不要亂學。 $jsFiles = ['main.js']; foreach (new \DirectoryIterator(ROOT

  • Hina Chen
    Hina Chen
6 min read
2019

[IT 鐵人賽] 薛丁格的生命週期 Day 12

是的,這個篇幅會用來聊一下生命週期當中,比較奇怪的事情。薛丁格 我就不解釋了,程式執行其實並沒有像是量子力學的那種疊加狀態,只是,當 Vue 的元件趨於複雜,再搭配上 Vue Router 的時候,你的某些生命週期中的勾子,就會有你所不知道的狀態。 最終狀態 有些時候你可能會遇到一個情況,當我們使用 console.log() 去印出某個物件的時候,你會發現他是有東西的。然後你如果印了某個物件的屬性,例如說 HelloKitty.foo 結果是 undefined。 不要問我為什麼,這是 JavaScript 的

  • Hina Chen
    Hina Chen
8 min read
VueJS

[IT 鐵人賽] Router 與生命週期 Day 11

我在先前的篇幅當中,有提到生命週期與路由的關係。我們這一個篇章,就將路由與生命週期之間的事情,做一個全面性的剖析。如果你之前有稍稍稍稍微留意我的部落格,應該會看過我曾經碎念過 Router 與生命週期之間的事情。 重新檢視 lifecycle 與 vue-router 關於 vue-router 外面的兩三事 VueJS 快速入門 Day 1 所以我就不跪求心理陰影面積了。 生命週期與 Hooks(勾子) 我們除了 Vue 原本就有的方法之外,如果另外再加上 Router 所提供的,那麼大家的順序上就很容易搞混,我們先條列一下到底會有哪些方法: beforeCreate

  • Hina Chen
    Hina Chen
10 min read