How to render different pages in a dynamic page?

Question

Vue.js

There are 3 kinds of page that I want to be available at "domain name/ article-tag-card name". How can I implement this if you can't make multiple dynamic pages in the pages folder?
The structure is
-pages/
--_card.vue
--_post.vue
--_tag.vue
But you can't do that. How can the problem be solved?

Answer 1

If I understand correctly that "3 types of page" means different types of display of the same content

<template>
    <component :is="dynamicComponent"
        :someProps="ololoProps"
    />
</template>

<script>
export default {
     name: 'OloloComponent',

     data() {
          return {
                ololoData: 'someShit',
          };
     },

  computed: {
    dynamicComponent() {
      if (someCondition) {
        return () => import('pages/card.vue');
      } else if (someAnotherCondition) {
        return () => import('pages/post.vue'');
      }

      return () => import('pages/tag.vue'');
    },

    ololoProps() {
      return { ololo1: 'testData', ololo2: 'test2' };
    },
  },
}
</script>