<template> <div>子组件：</div> <input type="text" v-model="msg"> <h1>{{ msg }}</h1> <h1>{{age}}</h1> </template> <script setup lang=ts> // import { defineEmits } from "vue"; const emit = defineEmits(["updata:msg", "updata:age"]); const props = defineProps({ msg:{ type:String, default:"", }, age:{ type:Number, default:0, } }) </script>

It seems like you're trying to create a Vue.js component with TypeScript using the <script setup> syntax. In your code, you have defined a component with a template that includes an input field and two <h1> tags to display the values of msg and age props.
To make your component work properly, you to make a few adjustments. Here's the updated code:
<template>
<div>
<div>子组件：</div>
<input type="text" v-model="localMsg">
<h1>{{ localMsg }}</h1>
<h1>{{ localAge }}</h1>
</div>
</template>

<script setup lang="ts">
import { defineProps, defineEmits } from 'vue';

const props = defineProps({
msg: {
type: String,
default: '',
},
age: {
type: Number,
default: 0,
},
});

const emit = defineEmits(['update:msg', 'update:age']);

let localMsg = props.msg;
let localAge = props.age;

// Watch for changes in localMsg and emit the update event
watch(() => localMsg, (newValue) => {
emit('update:msg', newValue);
});

// Watch for changes in localAge and emit the update event
watch(() => localAge, (newValue) => {
emit('update:age', newValue);
});
</script>
登录后复制
In the updated code:

We import defineProps and defineEmits from the Vue Composition API.
We define props using defineProps with the specified types and default values.
We define emit using defineEmits to handle the custom events.
We initialize localMsg and localAge with the prop values.
We use the watch function to listen to changes in localMsg and localAge. When a change occurs, we emit the corresponding update event.

With these changes, your component should now properly handle the two-way data binding between the input field and the props msg and age.