1. 程式人生 > >跟著專案學vue.js(六) 線上商店專案介紹

跟著專案學vue.js(六) 線上商店專案介紹

國慶之後,天氣陡然變冷,導致胃痙攣發作,修養了這麼長的時間,終於又可以開始更新了。。。

接上文,專案是原公司商店app的wap版,包括線上產品目錄購物車結賬功能。

線上產品目錄:客戶可以按類別瀏覽和分頁瀏覽

購物車:客戶可以新增和移除產品

結賬:客戶可以輸入發貨詳情並下單

完整的網站都需要一個後臺管理區域,用以維護網站配置和業務資訊,該區域受到保護,只有管理員登陸後才可以進行操作。

但現實中,作為商店app的wap版,和商店app共用一套介面。而已經執行過N年的app來說,它的後臺功能已經很完善了。

所以在這個系列中,並沒有類似網站後臺的功能,作為入門系列是非常完美的題材。在後面的文章中,會有專門的Vue開發後臺專案的講解, 但肯定不是這個系列了。

花幾分鐘搞了一個很low的首頁原型設計用作參考:

1、專案初始化

接上文,用腳手架建立搭建真實專案miansite,並使用上文中建立的預設ProjectStandard

2、專案建立成功

3、點選【安裝依賴】按鈕,新增元件庫weui-vue

 

4、安裝成功, 點選檢視詳情按鈕,可以進入github中的主頁,查閱相關文件。