vue在父组件给子组件传一个数组，数组中的数第一个是及格线，后面几个是学生成绩，在子组件里接受这个数组，根据数组里的及格线和学生成绩，计算出不及格人数，并显示在网页里。

在Vue中，你可以通过props（属性）将数据从父组件传递给子组件。首先，在父组件中定义并发送数组数据：

<template>
  <div>
    <child-component :grades="examGrades" />
  </div>
</template>

<script>
import ChildComponent from './ChildComponent.vue';

export default {
  components: {
    ChildComponent
  },
  data() {
    return {
      examGrades: [
        // 及格线分值,
        60,
        // 学生成绩列表
        { name: '学生A', score: 55 },
        { name: '学生B', score: 70 },
        { name: '学生C', score: 45 }
      ]
    };
  }
};
</script>

然后，在子组件`ChildComponent.vue`中接收这个数组，遍历它来计算不及格的人数：

<template>
  <div>
    <p>不及格人数：{{ unpassCount }}</p>
    <!-- 这里可以展示每个学生的得分情况 -->
    <ul>
      <li v-for="(student, index) in grades" :key="index">
        {{ student.name }} 的分数：{{ student.score }}
        <span v-if="student.score < 60">（不及格）</span>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  props: {
    grades: {
      type: Array,
      required: true
    }
  },
  computed: {
    unpassCount() {
      return this.grades.filter(student => student.score < this.grades[0]).length;
    }
  }
};
</script>

在这个例子中，子组件会根据`grades`数组的第一个元素（即及格线）来判断每个学生的成绩是否不及格，然后计算出不及格的人数并显示在页面上。