He creado el componente de la siguiente manera:
// Agregando componente, el nombre puede ser en kebab-case o PascalCase
app.component('item-post', {
// Todos los atributos que debo usar en el componente
props: ['title', 'desc'],
// Agregando el template del componente
template: `
<div class="item">
<h3>{{ title }}</h3>
<p>{{ desc }}</p>
</div>
`,
// Si lo requiere también podemos agregar los propios methods, computed, watch entre otros
});
Y usando el compoente de esta manera:
<div class="list">
<item-post
v-for="(item, i) in posts"
:key="i"
:title="item.title"
:desc="item.desc"
/>
</div>
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?