//父组件
<script setup lang="ts">
import Child from './components/Child.vue'const fnInFather = (msg:any) => {console.log("父组件的 fnInFather 函数触发了,拿到了后面的消息====>", msg.value)
}
</script><template><div><h2>我是父组件！</h2><Child foo="使用子组件通过 props 传值 !" @change="fnInFather"></Child></div>
</template><style lang="scss"></style>

//子组件<script setup lang="ts">
import { ref } from 'vue'
const props = defineProps({foo: String,
});let msg = ref('我是来自子组件的数据666')
const childfn = () => {console.log('我是子组件中的事件')emit('change', msg)
}
const emit = defineEmits(['change']);
</script><template><div>我是子组件<div>从父组件传过来的 foo : {{ foo }}</div><div @click="childfn" style="cursor: pointer;">点击我触发父组件绑定的 change 事件</div></div>
</template><style scoped></style>