Testing Vue + Builder

AboutView.vue

<script>
import { fetchOneEntry, Content, isPreviewing, getBuilderSearchParams } from '@builder.io/sdk-vue';

const BUILDER_API_KEY = "ad6be8b1102143a394cb9b2848f6a20c";

export default {
  data: () => ({
    canShowContent: false,
    content: null,
    apiKey: BUILDER_API_KEY,
  }),
  mounted() {
    fetchOneEntry({
      model: 'page',
      apiKey: BUILDER_API_KEY, // <-- Replace with your Public API Key
      options: getBuilderSearchParams(new URL(location.href).searchParams),
      userAttributes: {
        urlPath: window.location.pathname,
      },
    }).then(res => {
      this.content = res;
      this.canShowContent = this.content || isPreviewing();
    });
  },
}
</script>
<template>
  <div class="about">
    <h1>This is an about page</h1>
  </div>
    <Content
      v-if="canShowContent"
      model="page"
      :content="content"
      :api-key="apiKey"
    />
</template>

<style>
@media (min-width: 1024px) {
  .about {
    min-height: 100vh;
    display: flex;
    align-items: center;
  }
}
</style>