在选择学生的子组件中，根据实验提供的excel文件，按照要求选择10名学生，页面效果如图所示。且这10名数据要求从app.vue父组件中使用props传入，定义自定义事件，将选择学生的信息逐个传给父组件。

好的，我理解了你的问题。这是一个关于Vue组件通信的问题。

首先，在父组件App.vue中，你需要定义一个名为selectedStudents的数组，用来存储被选择的学生的信息。然后，将这个数组通过props传递给子组件StudentSelection。

在子组件中，你需要使用v-for指令来遍历父组件传递过来的selectedStudents数组，并使用v-bind指令将每个学生的信息传递给一个名为student的prop。在页面中，你可以使用v-bind:class指令来控制每个学生的样式，以及v-on:click指令来触发选择学生的事件。

在选择学生的事件处理函数中，你需要将被选择的学生信息添加到selectedStudents数组中，并使用$emit方法触发一个名为student-selected的自定义事件，将新的selectedStudents数组传递给父组件。

下面是一份可能的代码示例:

<!-- App.vue -->
<template>
  <div>
    <student-selection :selected-students="selectedStudents" @student-selected="onStudentSelected"></student-selection>
  </div>
</template>

<script>
import StudentSelection from './components/StudentSelection.vue'

export default {
  components: {
    StudentSelection
  },
  data() {
    return {
      selectedStudents: []
    }
  },
  methods: {
    onStudentSelected(newSelectedStudents) {
      this.selectedStudents = newSelectedStudents
    }
  }
}
</script>

<!-- StudentSelection.vue -->
<template>
  <div>
    <div v-for="student in selectedStudents" :key="student.id" :class="{ 'selected': student.isSelected }" @click="onStudentClick(student)">
      {{ student.name }}
    </div>
  </div>
</template>

<script>
export default {
  props: {
    selectedStudents: {
      type: Array,
      default: () => []
    }
  },
  methods: {
    onStudentClick(selectedStudent) {
      selectedStudent.isSelected = !selectedStudent.isSelected
      const newSelectedStudents = this.selectedStudents.filter(student => student.isSelected)
      this.$emit('student-selected', newSelectedStudents)
    }
  }
}
</script>

<style scoped>
.selected {
  background-color: yellow;
}
</style>

在这个示例中，我们定义了一个名为selected的属性来表示学生是否被选择。当用户点击一个学生时，我们会将这个属性取反，并过滤selectedStudents数组，获取新的被选择的学生列表。随后，我们会使用$emit方法触发一个自定义事件，并将新的selectedStudents数组作为参数传递给父组件。

希望这能够回答你的问题。如果你还有任何疑问，请随时问我。