2019 3 21消滅仿美團實戰產品列表頁開發

2021-09-13 08:29:20 字數 1110 閱讀 3268

1、limit 與 slice

簡單的講,乙個作用資料庫返回的集合。乙個作用陣列

2、生成26個英文本母的陣列(split)

3、ssr方式與非同步獲取

a、ssr即服務端一次頁面html檔案時,即傳送了axios,並將需要的資料響應回來。不用二次axios請求回來渲染頁面。(同步渲染)

ssr方式有:vuex ,父子元件傳值。

b、非同步獲取:頁面必將先載入html,再發出請求載入axios內容。(非同步渲染)

4、對於首字母相同的城市名變數的陣列化,操作。

pyjs是js-pyjs拼音包,能自動將漢字轉成拼音。

p、c、d全是臨時變數,

p 獲取該城市的首字母

c 獲取首字母的acsll碼

d 乙個物件,儲存26個首字母的物件,若不存在則生成,並推進變數。

大體效果如下。

d: 5、sort(a,b)排序問題

將blocks裡的物件中的title的首字母的ascll碼按照公升序排列

(演算法不做深究,具體和冒泡差不多)

第10章城市排序結束了,總結:

前端,並不是頁面的靜態布局,你要做得好,你要昇華你的頁風,必須要結合資料結構的設計,沒有資料結構的支撐,在排列的布局也只是個殼,所有,你想成為什麼樣的人,決定了你能成為什麼樣的人,前端一樣可以高大上。

開始第11章,產品列表布局。

1、dd中可以巢狀標籤

2、晚20:44分,ssr和傳統非同步,真的在體驗感上相差非常大。如果你用的是普通非同步獲取資料,那麼就會出現如下,頁面抖動,高度坍塌,資料不同步等問題

備份一下我的**。

下面開始修改為nuxt自帶的非同步渲染模式

仿美團pc,koa ssr(六)

一,地點詳情頁 product.vue元件,點選h3標題,跳轉到對應地點的詳情detail路徑 商品 rate v model meta.rate colors ff9900 ff9900 ff9900 disabled v if meta.rate 4 class s item comment 很...

仿美團pc,koa ssr(四)

一,城市服務功能 components 新建changecity目錄 新建isselect.vue元件 按省份選擇 select v model pvalue placeholder 省份 option v for item in province key item.value label item...

react native高仿美團V1 1

v1.1目前在v1的基礎上稍作修改,如猜你喜歡介面的排版布局和目前真實的美團是幾乎一樣的 需要注意的是 新客減4元 這個黃色小框是根據不同情況來處理的,在返回的json中的字典中可能有或沒有這個鍵,所以要判斷一下 具體功能封裝了乙個function rendercampaigntag campaig...