Vue Js display only the first N items of a list

<!DOCTYPE html>
<html>
<head>
	<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
</head>
<body>
	<h3>Vue Js show only the first N items of a list </h3>
	<div id="app">
		<label for="num-to-show">Number of items to show:</label>
		<input type="number" id="num-to-show" v-model="numToShow" min="0">
		<ul>
			<li v-for="item in slicedItems" :key="item.id">
				{{ item.name }}
			</li>
		</ul>
	</div>
	<script type="module">
		const app = Vue.createApp({
			data() {
				return {
					developers: [
						{ id: 1, name: "Linus Torvalds" },
						{ id: 2, name: "Tim Berners-Lee" },
						{ id: 3, name: "Ada Lovelace" },
						{ id: 4, name: "Grace Hopper" },
						{ id: 5, name: "Alan Turing" },
						{ id: 6, name: "James Gosling" },
						{ id: 7, name: "Bjarne Stroustrup" },
						{ id: 8, name: "Guido van Rossum" },
						{ id: 9, name: "Yukihiro Matsumoto" },
						{ id: 10, name: "Rasmus Lerdorf" },
						{ id: 11, name: "Anders Hejlsberg" },
						{ id: 12, name: "Brendan Eich" },
						{ id: 13, name: "Larry Wall" },
						{ id: 14, name: "Martin Odersky" },
						{ id: 15, name: "John Carmack" },
					],
                  numToShow: 3,
				}
			},
			computed: {
				slicedItems() {
					return this.developers.slice(0, this.numToShow);
				},
			},
		});
		app.mount('#app');
	</script>
	</body>
</html>