This is the full code / context:
<template>
<ion-grid>
<ion-row>
<ion-col size="6" v-for="p in publications" :key="p.id">
<img :src="p.img" @click="openPage(p)">
</ion-col>
</ion-row>
</ion-grid>
</template>
<script lang="ts">
import {IonCol, IonGrid, IonRow} from '@ionic/vue';
import {useRouter} from 'vue-router';
import store from './../store'
export default {
components: {IonCol, IonGrid, IonRow},
setup() {
store.setPublications([
{id: 1, img: 'https://picsum.photos/200?random=1', url: '/publication/1', code: 'CODE1'},
{id: 2, img: 'https://picsum.photos/200?random=2', url: '/publication/2', code: 'CODE2'},
]);
const router = useRouter();
return {
router,
};
},
data() {
return {
publications: store.state.publications
}
},
methods: {
openPage(p: object) {
this.$router.push(p.url)
}
}
}
</script>
<style scoped>
ion-col img {
width: 100%;
height: 200px;
}
</style>
I still get the error: