脚手架，父组件传值，子组件有效修改

子组件

<template>
  <div id="child1" :style="{background:'url('+imgUrl+') no-repeat'}">
    <ul>
      <li
        v-for="(item, index) in stuArr"
        :key="index"
        @click="changeInfo(index)"
      >
        姓名：{{ item.name }} &nbsp;年龄：{{ item.age }}&nbsp;性别：{{
          item.sex
        }}
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "child1",
  data(){
      return{
          imgUrl:require('../assets/logo.png')
      }
  },
  props: {
    stuArr: {
      type: Array,
      default: () => [],
    },
  },
  methods: {
    changeInfo(i) {
      if (i == 0) {
        this.$emit("fResC", i, "许云鹤", 24, "男");
      } else {
        this.$emit("fResC", i, "小黄鸭", 11, "男");
      }
    },
  },
};
</script>

父组件

<template>
  <div id="app">
    <child1 :stuArr="objArr" @fResC="fRes"> </child1>
  </div>
</template>

<script>
import child1 from "@/components/child1.vue";

export default {
  name: "App",

  components: {
    child1,
  },

  data() {
    return {
      objArr: [],
    };
  },

  methods: {
    fRes(i, name, age, sex) {
      this.objArr[i].name = name;
      this.objArr[i].age = age;
      this.objArr[i].sex = sex;
    },
  },

  created() {
    setTimeout(() => {
      let stus = [
        { name: "Mike", age: 16, sex: "男" },
        { name: "韩Sir", age: 22, sex: "男" },
        { name: "团团", age: 19, sex: "女" },
      ];
      this.objArr = stus;
    }, 300);
  },
};
</script>




<style>
/* #app{
  width: 400px;
  height: 400px;
  background: url(./assets/logo.png) no-repeat;
} */
</style>