每個商品對應許多品牌，需要把每個品牌對應商品資訊展現給使用者、當商品資訊比較少，可以一行一行寫wxml标簽。
當商品資訊比較多，又不固定的時候、就推薦使用小程式渲染屬性了。
通過wx:for綁定數組，使用wxml清單渲染屬性、在data對象裡定義了items數組、裡面是各個商品名稱，在wxml檔案内block标簽裡通過wxfor屬性傳入數組。
index變量:index變量指的是目前元素在數組的下标，也可以通過wx:for="{{index}}"屬性，設定變量名。
item變量:item變量指的是數組中的目前元素，也可以通過wx:for="{{item}}"屬性，指定想要的一個變量名。
wx:key屬性:key代表項目中唯一的标志符、能保持清單項目中自身的一個狀态，在頁面重新渲染的時候確定帶有key元件重新的排序，而不是重新的渲染、進而提高頁面渲染的效率。
如圖：
block不是元件、隻是包裝元素，在頁面渲染的時候、block不會被渲染出來的。
每天吃什麼？用小程式條件渲染屬性。
index.wxml中語句的含義：綁定了condition變量、當傳入的condition變量值是1的時候、今天就吃餃子，當傳入的condition變量值是2的時候、今天就吃米飯，
當傳入的condition變量值是3的時候，今天就吃面食。
條件渲染是通過3種屬性控制的，是 wx:if、wx:elif、wx:else 這3種屬性共同來控制的條件渲染。
index.js檔案，在data對象定義了condition變量，變量值的意思生成1到3随機整數。
Mate.random 函數，它是生成‘0’到‘1’的浮點随機數。
Mate.floor 函數，它是對一個浮點數進行處理，來傳回一個下區整數。
傳給vs檔案的condition變量值是3，小程式頁面幫我們找到 面食。
wx:if 和 hidden的差別：他們都給控制元素的顯示，wx:if在切換是架構有一個局部渲染的過程，會多次進行重複渲染，有更高的切換消耗的。
hidden會有更多的初始化渲染消耗，如果元素平凡切換顯示，用hidden更适合！