Vue.js Vuejs 3 从子组件向父组件发出事件

我最近开始使用VueJS，我正在使用v3，似乎在调用父对象上的方法时遇到了问题.子对象中的emit函数似乎没有发出事件，父对象中没有接收到任何内容.

我已经包括了父母和子元素来展示我是如何设置的

Parent

<template>
  <First/>
  < Child v-bind:sample="sample" @enlarge-text="onEnlargeText"/>
</template>

<script lang="ts">
import { defineComponent } from 'vue';
import axios from 'axios';
import First from './First.vue';
import Child from './Child.vue';

export default defineComponent({
  name: 'Container',
  components: {
    First,
    Child,
  },
  methods: {
    onEnlargeText() {
      console.log('enlargeText');
    },
  },
  data: () => ({
    sample: [],
    parentmessage: '',
  }),
  created() {
    axios.get('http://localhost:8080/getData')
      .then((response) => {
        console.log(response);
        this.sample = response.data;
      })
      .catch((error) => {
        console.log(error);
      });
  },
});
</script>

Child

<template>
  <div id="add">
    <form id="signup-form" @submit.prevent="submit">
      <label for="text">Text:</label>
      <input type="text" v-model="text" required>
      <p class="error" >{{ error }}</p>
      <div class="field has-text-right">
        <button type="submit" class="button is-danger">Submit</button>
      </div>
    </form>
    <button v-on:click="tryThis">
      Enlarge text
    </button>
</div>
</template>

<script lang="ts">
import { defineComponent, ref } from 'vue';
import axios from 'axios';

interface SampleInterface {
  text: string;
  error: string;
}

export default defineComponent({
  name: 'Add',
  data: (): AddInterface => ({
    text: '',
    error: '',
  }),
  methods: {
    tryThis() {
      this.$emit('enlarge-text');
    },
    submit() {
      this.$emit('enlarge-text');
    },
  },
});
</script>

这应该怎么做？我错过了什么吗？

我在想我还能用$emit吗？