전 왜 자꾸 undefined가 뜰까요..?

코드는 그대론데..

Checkbox.vue

<template>
	<div>
		<input type="checkbox" :value="value" @change="toggleCheckBox" />
	</div>
</template>

<script>
export default {
	// @input 이벤트

	// :value 값

	props: ["value"],

	methods: {
		toggleCheckBox() {
			this.$emit("input", !this.value);
			console.log(this.value);
		},
	},
};
</script>

App.vue

<template>
	<check-box v-model="checked"></check-box>
</template>

<script>
import CheckBox from "./components/CheckBox.vue";

export default {
	components: {
		CheckBox,
	},

	data() {
		return {
			checked: false,
		};
	},
};
</script>