I want to add images later, but I am using v-for
, and I don’t know what to do to add the image in between without breaking the loop.
<template>
<v-card>
<p v-for="item in texts" :key="item.id" class="bm-1">{{ item.text }}</p>
</v-card>
</template>
<script lang="ts">
import { Vue } from "nuxt-property-decorator";
export default class QuickStart extends Vue {
texts: any[] = [
{
id: 0,
text: "Text A",
},
{
id: 1,
text: "Text B",
},
{
id: 2,
text: "Text C",
},
];
}
</script>
For example, in the code above, I want to add an image between id 1 and 2, but how? (And I want to use the v-for
too. If that wasn’t the case, I know I could have just added numbers or p
tags.)
I tried to put an image with an id
and text
, but as expected, it didn’t work.