(blog) fix querySelectorAll on $el which fails as <Page> is a fragment

This commit is contained in:
Valentyne Stigloher 2024-09-20 19:15:17 +02:00
parent 65b18279ba
commit 939fc0bbd9

View File

@ -1,7 +1,7 @@
<template> <template>
<Page> <Page>
<NotFound v-if="!content" /> <NotFound v-if="!content" />
<div v-else class="blog-post"> <div v-else ref="post" class="blog-post">
<p v-if="!config.links.split"> <p v-if="!config.links.split">
<router-link v-if="config.links.blog" :to="`/${config.links.blogRoute}`"> <router-link v-if="config.links.blog" :to="`/${config.links.blogRoute}`">
<Icon v="pen-nib" /> <Icon v="pen-nib" />
@ -66,6 +66,8 @@ export default defineComponent({
banner: computed(() => blogEntry.value.img), banner: computed(() => blogEntry.value.img),
}, translator); }, translator);
const post = useTemplateRef<HTMLDivElement>('post');
try { try {
const markdown = (await import(`~/data/blog/${route.params.slug ?? route.meta.slug}.md`)).default; const markdown = (await import(`~/data/blog/${route.params.slug ?? route.meta.slug}.md`)).default;
blogEntry.value = await parseMarkdown(markdown, translator); blogEntry.value = await parseMarkdown(markdown, translator);
@ -77,6 +79,7 @@ export default defineComponent({
config: useConfig(), config: useConfig(),
title: blogEntry.value.title, title: blogEntry.value.title,
content: blogEntry.value.content, content: blogEntry.value.content,
post,
}; };
}, },
data() { data() {
@ -100,7 +103,7 @@ export default defineComponent({
await this.$loadScript('facebook', 'https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v19.0', 'xwbrn1J4'); await this.$loadScript('facebook', 'https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v19.0', 'xwbrn1J4');
} }
for (const wall of this.$el.querySelectorAll('.columnist-wall')) { for (const wall of this.post?.querySelectorAll('.columnist-wall') ?? []) {
const columnist = new Columnist(wall); const columnist = new Columnist(wall);
columnist.start(); columnist.start();
} }