很久以前，在同一個星系中，我開始嘗試製作 Freecell，作為學習 Angular 1.3 的一種方式。

我已經走了這麼遠，然後我就被其他事情分散了注意力，就像副項目一樣。

我最近有一些空閒時間（我知道，我也沒想到），所以我想我應該再試一次。

我基本上是從頭開始，因為我對 Angular 1.3 不再感興趣，如果我需要一個框架，我傾向於使用 VueJS 來處理我的 Web 內容。

要查看結果，請訪問 github.io：點擊此處玩空當接龍！

自從我十五年前學習 WPF 以來，我就非常喜歡 MVVM 程式設計風格。 VueJS 非常容易地允許這種風格，甚至對其進行改進，而不需要明確事件來更新 UI。

這意味著遊戲邏輯與視圖邏輯完全分離，這使得編寫這個遊戲變得輕而易舉。

這並不全是飛機航行，因為出於某種原因，我決定將卡片存放在二維鋸齒狀陣列中。這不是一個糟糕的主意，但每個內部數組都是一列，所以當我試圖讓卡片在 CSS 網格中正確佈局時，我不能只迭代外部數組，然後迭代內部數組，例如

因為這會將列排列為行。所以我不得不使用索引（為什麼 VueJS 不從 0 開始？？？）而不是物件並在內部循環上循環外部數組：

我認為我做出的另外兩個糟糕的設計決策是實現自動完成，並使點擊處理程序只是遊戲中的一個功能（即模型），而不是在視圖中，並讓視圖確定哪個過程採取的行動。

讓遊戲決定玩家的意思（即選擇一張牌（或一堆牌）、將牌放在另一堆牌上或取消選擇牌）導致了一些意大利麵條式代碼，我可能想在以後重構這些程式碼。

最初我不想實現自動完成，因為我不想考慮邏輯。但在沒有它玩了幾場遊戲後，我對將每張卡敲入主行感到非常無聊，以至於我覺得有必要實施它。

我應該堅持我的立場，因為這很糟糕。這是一大堆程式碼，最初導致了一堆錯誤和令人頭痛的問題。它甚至不是全自動的。另一方面，現在我幾乎不需要做那麼多的敲擊。

我確實堅持不讓卡片拖放，因為我製作這個主要是為了在我的手機和平板電腦上玩，所以從用戶體驗角度來說，點擊到位要容易得多（至少是我的用戶體驗， ymmv).

總的來說，我對結果感到滿意，即使有一些錯誤揮之不去。