Fieldtype example for a cascading select

Fieldtype.js

const Fieldtype = {
  mixins: [window.Storyblok.plugin],
  template: `<div>
  <div class="uk-form-row">
    Category
    <select v-model="model.category" class="uk-width-1-1">
      <option></option>
      <option :key="item.id" :value="item.id" v-for="item in categories">{{ item.name }}</option>
    </select>
  </div>
  <div class="uk-form-row" v-if="subCategories.length > 0">
    Sub-Category
    <select v-model="model.subCategory" class="uk-width-1-1">
      <option></option>
      <option :key="item.id" :value="item.uuid" v-for="item in subCategories">{{ item.name }}</option>
    </select>
  </div>
</div>`,
  data() {
    return {
      categories: [],
      allSubCategories: []
    }
  },
  computed: {
    subCategories() {
      return this.allSubCategories.filter((category) => {
        return category.parent_id == this.model.category
      })
    }
  },
  methods: {
    initWith() {
      return {
        plugin: 'sb-cascanding-selector',
        category: '',
        subCategory: ''
      }
    },
    pluginCreated() {
      this.api
        .get('cdn/links', {starts_with: 'categories/', version: 'draft'})
        .then((res) => {
          for (var uid in res.data.links) {
            if (res.data.links[uid].is_folder) {
              this.categories.push(res.data.links[uid])
            } else {
              this.allSubCategories.push(res.data.links[uid])
            }
          }
        })
    }
  },
  watch: {
    'model': {
      handler: function (value) {
        this.$emit('changed-model', value);
      },
      deep: true
    }
  }
}