04 Vue 專案準備《餓了嗎》

2021-10-10 21:04:54 字數 1207 閱讀 5777

商品頁

spa(單頁面開發): 快、區域性重新整理、減少請求大小、體驗有明顯變化;

實現原理: 在頁面中,如果只是錨點發生變化時,是不會有任何的請求操作的,只是在當前頁面找對應的錨點位置;另外錨點值發生變化時是可以監聽到的,所以可以利用js當錨點值的改變時,向伺服器發起資料請求,獲取到資料之後,只需要區域性重新整理頁面即可

在webpack構建專案中,最好都是使用單張圖,因為webpack會幫我們將進行打包,將base64之後打包到js檔案中,即沒有大圖時根本都不會有請求操作(只有大於10kb的才會生成靜態檔案)。另外,移動端一般都分普通圖、2倍圖、3倍圖,不同螢幕解析度對應不同。

將字型圖示字型拷貝到fonts目錄中,另外將字型樣式style.css拷貝到stylus目錄中,檔名改為icon.styl,就是使用stylus語法,另外還需要對檔案進行簡單的處理(刪除{},刪除;)

-assets目錄可以不需要,直接刪除;

專案是前後端分離,專案中的資料獲取資料一般通過ajax非同步獲取到資料。

var express = require('express');

// 路由器

var routes = express.router();

// **首頁接受 get 請求

routes.get('/seller', (req, res) => ,

errno: 0 // 表示沒有錯誤

});});routes.get('/goods', (req, res) => );

// 注意: 是express中的api,不是vue中的

json格式化工具:

頁面中很多樣式都需要重置的,而這個**不需要編譯生成,所以就是新增在static目錄中,可以自動手動寫,也可以參考其他**寫法,或者直接使用cssreset。另外index.html就是乙個外殼框架,所以就只需要在這裡引入該樣式即可。

Vue專案實戰04 Vue 輪詢介面的實現

專案中我們經常需要實現輪詢 每隔幾秒請求一次介面重新整理資料 一般都會使用setinterval,但要注意單純使用它會導致頁面卡死,所以一定要清除定時器 setinterval不會清除定時器佇列,每重複執行1次都會導致定時器疊加,最終卡死你的網頁。但是settimeout是自帶清除定時器的 moun...

04vue 模板語法 指令

指令 directives 是帶有v 字首的特殊屬性。即 vue給html元素增加了一些自定義屬性,這些自定義是屬性是以 v 開頭的屬性 v text 更新元素的 textcontent。如果要更新部分的 textcontent 需要使用 插值。v html 更新元素的 innerhtml v sh...

04 Vue之v bind v on的使用

doctype html en utf 8 viewport content width device width,initial scale 1.0 document title v cloak style head 使用 v cloak 能夠解決 插值表示式閃爍的問題 p msg h4 預設 v...