用 Vue 做乙個簡單的購物app

2021-09-28 01:25:29 字數 1285 閱讀 2518

一整個專案寫下來,最大的感覺就是元件式開發,管理起來實在是太舒服了。而且vue中寫scss還可以指定區域性有效。這樣寫起scss感覺安全多了。用 vuex 進行全域性資料管理也挺舒心的。element-ui 則大大解放了生產力。

上述技術棧簡要說明:

vue-cli

vue-cli 就是使用搭建vue專案的腳手架,會幫你生成webpack的配置,以及大部分專案需要使用到的依賴,你只需要 install 就可以了。配置過 webpack 的同學應該能體會到使用 vue-cli 的爽。

vue-router

vue-router 主要用於單頁應用的頁面切換,用路由的好處是不用重新整理頁面,就可以跳轉頁面,而且 url 會變化,便於使用者收藏位址。常用於不需要與後端互動資料的頁面變化操作。

vuex

vuex 是乙個專為 vue.js 應用程式開發的狀態管理模式。簡單來說就是專門用於管理資料的乙個全域性物件。我覺得用 vuex 管理資料的最大好處是便於維護,以及方便與後端互動資料。

axios

axios 是乙個基於 promise 的 http 庫,可以用在瀏覽器和 node.js 中。

axios 不支援 jsonp ,如果需要,要單獨引入 jsonp。

element-ui、mint-ui

這兩個都是餓了麼團隊貢獻的 ui 元件庫,其中 mint-ui 更輕量,更適用於手機端,但我實踐過程中是發現 mint-ui 的功能太少,很難滿足需求。以單獨引入的方式使用 element-ui 可減小其占用體積,也是不錯的選擇。

1、當元件中的 style 標籤中使用了 scoped,會導致某些 element-ui 中的預設樣式修改無效。

2、父路由切換到子路由,位址發生了變化,頁面卻沒出來

解決辦法:父路由的頁面中需要新增 router-view 子路由才會顯示出來。

3、computed 不能傳入引數

解決辦法:使用 methods。不過一般情況下,如果能用computed解決的都用computed,因為computed會把結果快取,效能更優。

由於很多問題都是做專案的時候,順便就搜尋解決了,一時也想不起來還有什麼特別的問題了。

如有什麼建議,或我可以解決的問題,歡迎聯絡本人。

最後如果大神們如有什麼高階專案推薦,也請多多指教。有好玩的專案寫,動力就大大不一樣。

如果本專案對你有幫助,請在 github 賜個 star 咯。

另外本人找工作ing,如有本人可以勝任的工作,請給個機會。畢竟自已獨自在家寫**,不如在團隊中寫**有意思。

更多專業前端知識,請上

【猿2048】www.mk2048.com

用redis做乙個簡單的秒殺

下面是乙個簡單的下單操作 include mmysql.class.php configarr host port user passwd dbname db new mmysql configarr sql select from sdb b2c products where product id...

用redis做乙個簡單的秒殺

下面是乙個簡單的下單操作 include mmysql.class.php configarr host port user passwd dbname db new mmysql configarr sql select from sdb b2c products where product id...

vue2 x 做乙個外賣app

現在最流行的開發方式就是前後分離了 vue 也是現在最流行的前端框架之一。在手機上掃碼體驗效果更好 vue 有自己的腳手架構建工具 vue cli 使用起來非常方便,使用 webpack 來整合各種開發便捷工具,比如 除此之外,vue cli 已經使用 node 配置了一套本地伺服器和安裝命令等,本...