[Vue3：组件通信）子组件props接收和watch监听，emit发送父组件 (添加修改设置成绩，添加、删除选课记录）

<template>
  <div>
    <input v-model="inputScore" @input="updateScore" />
  </div>
</template>
 
<script setup>
import { ref, watch } from 'vue';
const props = defineProps({
  score: Number,
  questionId: Number
});
 
const emit = defineEmits(['update-score']);
 
const inputScore = ref(props.score);
 
watch(inputScore, (newScore) => {
  emit('update-score', { questionId: props.questionId, score: newScore });
});
 
function updateScore() {
  inputScore.value = parseInt(inputScore.value) || 0;
}
</script>

这个示例展示了如何在Vue 3组件中使用<script setup>语法来实现props的接收和watch的使用。子组件有一个输入框，用户可以在其中输入分数，并通过watch来监听输入的变化，一旦发生变化，就通过自定义事件update-score发送给父组件。父组件需要监听这个事件，并相应地更新组件的状态。