数据- > meals: { breakfast: false, lunch: false, dinner: false, temp: true }
<view
wx:for="{{meals}}" wx:for-index="key" wx:for-item="value" wx:key="key" >
<text>{{key}}</text>
</view>
key是属性对应属性(breakfast、lunch、dinner、temp),value对应属性的值(false、true)
下面是数组里面套对象
weekDays: [
{
dayName: '周一',
date: '04.14',
selected: false,
meals: { breakfast: false, lunch: false, dinner: false, temp: false }
},
{
dayName: '周二',
date: '04.15',
selected: false,
meals: { breakfast: false, lunch: false, dinner: false, temp: false }
},
{
dayName: '周三',
date: '04.16',
selected: false,
meals: { breakfast: false, lunch: false, dinner: false, temp: false }
}
],
mealTextMap: {
breakfast: '早餐',
lunch: '午餐',
dinner: '晚餐',
temp: '临时餐'
},
<block wx:for="{{weekDays}}" wx:key="date">
<view class="day-info">
<checkbox class="day-checkbox"
bindtap="toggleDay" data-day="{{index}}" checked="{{item.selected}}"
></checkbox>
<view>{{item.dayName}}</view>
<view class="day-date">({{item.date}})</view>
</view>
<view class="meal-options">
<view
class="meal-option {{value ? 'selected' : ''}}"wx:key="key" bindtap="toggleMeal"
wx:for="{{item.meals}}" wx:for-index="key" wx:for-item="value"
data-index="{{index}}" data-key="{{key}}" data-value="{{value}}"
>
<text>{{mealTextMap[key]}}</text>
</view>
</view>
</block>
微信小程序循环数组与对象示例
838

被折叠的 条评论
为什么被折叠?



