解决vue3报错:Unexpected mutation of “xxx“ prop.(eslintvue/no-mutating-props)

<enter-school ref="enterSchoolRef" :student-info="selectRows" />

<template>
    <el-form ref="formRef" class="enterForm" inline :model="form" :rules="rules" @submit.prevent>
      <el-input
          v-model="studentInfo[0].name"
          clearable
          placeholder="请输入姓名"
        />
     </el-form>
</template>
<script>
    props: {
      studentInfo: {
        type: Array, //类型
        default: null //默认值
      },
    },
</script>

<template>
 <el-input
      v-model="studentName"
      clearable
      placeholder="请输入姓名"
 />
</template>
<script>
    import { computed } from 'vue'
    props: {
      studentInfo: {
        type: Array, //类型
        default: null //默认值
      },
    }
    setup(props) {
      const studentName = computed(() =>
        props.studentInfo &&
        props.studentInfo.length > 0 ? props.studentInfo[0].name : null
      )
      return {
          studentName 
     }
    }
</scirpt>

<template>
 <el-input
      v-model="studentName"
      clearable
      placeholder="请输入姓名"
 />
</template>
<script>
    import { computed, defineComponent, reactive, toRefs } from 'vue'
    props: {
      studentInfo: {
        type: Array, //类型
        default: null //默认值
      },
     }
    export default defineComponent({
    setup(props) {
      const state = reactive({
        studentName ： props.studentInfo[0].name
      })
      return {
          ...toRefs(state),
     }
    }
   })
</scirpt>