vitedge-spa-example.ts

import { defineComponent } from 'vue'

export default defineComponent({
  name: 'Station',

  props: {
    station: {
      type: Object,
      default: null
    }
  },

  data(): Record<string, any> {
    return {
      meta: this.station || null
    }
  },

  async mounted(): Promise<void> {
    if (!this.station) {
      // Get meta data
      await this.fetchMetaData()
    }
  },

  methods: {
    /**
     * Fetch station meta data
     */
    async fetchMetaData(): Promise<void> {
      await fetch(`/stations/meta?id=${this.$route.params.id}`)
        .then(response => response.json())
        .then(data => this.meta = data.data)
    }
  }
})