Dealing with a frustrating issue in my Vue application. One page is functioning perfectly fine, while the other is causing trouble by displaying this error:
The first page loads a collection of wordpress posts (Blog.vue) without any issues, but the second one, which displays an individual post, throws an error stating:
TypeError: $setup.post is undefined
Blog.vue
<template>
<v-col v-for="post in wpposts" cols="12" sm="4">
</template>
<script lang="ts" setup>
import ...
onMounted(() => {
getPosts();
})
onUpdated(() => {
var msnry = new Masonry('.masonry', {
// options
itemSelector: "[class*='col-']",
});
})
const rootUrl = 'https://myurl.com/';
const wpposts = ref()
async function getPosts() {
const data = await fetchData(new Request(rootUrl + 'index.php/wp-json/wp/v2/posts?_embed')) as Post[];
data.forEach(element => {
...
wpposts.value = data;
}
const fetchData = async <T>(request: Request): Promise<T> => {
const response = await fetch(request);
return await response.json();
}
BlogPost.vue Encountering the following error
TypeError: $setup.post is undefined
<template>
<v-container fluid>
<!-- <Suspense> -->
<v-row>
<v-col cols="12" sm="4"gt;
<v-img height="250" :src="post.imageUrl" cover></v-img> <!-- Blowsup -->
</v-container>
</template>
<script lang="ts" setup>
import { ref, onMounted, onUpdated, type Ref, reactive } from 'vue'
import { DateTime } from "luxon";
import { Post } from "../blogtypes";
const props = defineProps({
id: String,
url: String
})
onMounted(() => {
getPost();
})
const post = ref()
const rootUrl = 'https://myurl.com/';
async function getPost() {
const data = await fetchData(new Request(rootUrl + 'index.php/wp-json/wp/v2/posts/' + props.id + '?_embed')) as Post;
...
post.value = data;
}
const fetchData = async <T>(request: Request): Promise<T> => {
const response = await fetch(request);
return await response.json();
}
</script>
Struggling to figure out a solution for this error as one component works flawlessly with this code structure while the other encounters
TypeError: $setup.post is undefined