為大家介紹的就是購物車，這里演示從商品列表中添加到購物車。

  下面先做商品列表頁。如下圖：

  布局分析：

  首先一個list的主盒子，接著是item盒子，這是必須的。然后把item分成左側的圖片部分，和右側的說明部分（item盒子使用橫向彈性盒）右側的說明部分又分上下2部分（右側說明部分盒子使用縱向彈性盒）下面價錢購物車部分（下面價錢購物車部分也使用橫向彈性盒，中間使用justify-content: space-between;填充空白）

  數(shù)據(jù)部分，一般情況都是訪問接口獲取數(shù)據(jù)的，這里并沒有使用網(wǎng)絡訪問，為了簡化demo，直接把一組數(shù)據(jù)放在data對象中。同學們可以根據(jù)其數(shù)據(jù)結構自己編寫后臺接口。

  編寫購物車部分，如下圖所示：

  布局分析：

  首先一個list的主盒子，接著是item盒子，這是必須的。

  然后把item分成左側的圖片部分，和右側的說明部分（item盒子使用橫向彈性盒）

  右側的說明部分又分上下2部分（右側說明部分盒子使用縱向彈性盒）

  下面價錢、購物加減、購物車部分（使用縱向彈性盒）

  最下面的購物加減、購物車部分（使用橫向彈性盒，中間使用justify-content: space-between;填充空白）

  運行結果：

  demo：相關閱讀：

  微信小程序實戰(zhàn)商城系列（4）—— 商品屬性分類

  微信小程序實戰(zhàn)商城系列（3）—— 購物數(shù)量加減

  微信小程序實戰(zhàn)商城系列（2）—— 仿淘寶分類入口

  微信小程序實戰(zhàn)商城系列（1）—— 側欄分類