vue中如何实现，监听到父组件中的name修改了调用子组件的方法

在Vue中，可以通过watch监听父组件中的name属性的变化，然后在watch的回调函数中通过this.$refs调用子组件的方法，示例代码如下：

// 父组件
<template>
  <div>
    <button @click="changeName">修改name</button>
    <Child ref="childComponent" />
  </div>
</template>

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

export default {
  components: {
    Child,
  },
  data() {
    return {
      name: '张三',
    };
  },
  methods: {
    changeName() {
      this.name = '李四';
    },
  },
  watch: {
    name(newName) {
      this.$nextTick(() => {
        this.$refs.childComponent.childMethod(newName);
      });
    },
  },
};
</script>

// 子组件
<template>
  <div>{{ message }}</div>
</template>

<script>
export default {
  data() {
    return {
      message: '我是子组件',
    };
  },
  methods: {
    childMethod(name) {
      this.message = `我是${name}的子组件`;
    },
  },
};
</script>

当父组件中的name属性发生变化时，watch的回调函数会被调用，然后通过this.$refs找到子组件实例，最后调用子组件的方法实现了父子组件的通信。