需求4：v-for迭代对象数组，输出价格大于50的马克杯。 编写代码

在Vue.js中，你可以使用`v-for`指令结合条件判断来实现这个需求。假设你有一个名为`mugCollection`的对象数组，每个对象都有`name`和`price`属性，你可以这样做：

<template>
  <ul>
    <li v-for="mug in mugCollection" :key="mug.name">
      {{ mug.name }} - {{ mug.price }}
      <!-- 使用v-if检查价格是否大于50 -->
      <span v-if="mug.price > 50"> (Price > 50)</span>
    </li>
  </ul>
</template>

<script>
export default {
  data() {
    return {
      mugCollection: [
        { name: 'Mug A', price: 30 },
        { name: 'Mug B', price: 60 },
        { name: 'Mug C', price: 70 },
        // 更多对象...
      ],
    };
  },
};
</script>

在这个模板中，只有价格大于50的马克杯会显示"(Price > 50)"。如果`mugCollection`中的价格没有符合条件的，相应的标记也不会显示。