<template>
<div>
这是子组件 ==> {{ num }}
<button @click='changeNum'>按钮</button>
</div>
</template>
<script lang="ts">
import { defineComponent, ref } from 'vue';
export default defineComponent({
setup(_, { emit }) {
let num = ref(100);
const changeNum = () => {
emit('fn', num.value);
}
return {
num,
changeNum
}
}
});
</script>
<template>
<div>
<child-component @fn="handleFn"></child-component>
</div>
</template>
<script lang="ts">
import ChildComponent from '@/components/List.vue'
export default {
components: {
ChildComponent
},
methods: {
handleFn(payload: number) {
console.log('Received payload:', payload);
}
}
}
</script>