...

/

Solution Review: Convert Options to Composition

Solution Review: Convert Options to Composition

Convert the Options API code to use the Composition API.

We'll cover the following...

Solution

The solution to the “Convert Options To Composition” challenge is provided below:

<script setup>
const todos = ref([]);
function addTodo() {
	todos.value.push({
		id: todos.value.length + 1,
		title: `Todo number ${todos.value.length + 1}`,
	});
}
addTodo();
</script>
<template>
	<h1>Composition API Code</h1>
	<ul>
		<li v-for="todo in todos" :key="todo.id">{{ todo }}</li>
	</ul>
	<button @click="addTodo">Add Todo</button>
</template>

Implement the code solution

Explanation

Here ...