Vue无法读取未定义的属性“$refs”

我有一个 Vue 利用的应用程序 Vuetify . 在这个应用程序中,我有一个名为 city-selector.vue 设置如下:

<template>
  <select-comp
    :id="id"
    :items="cityList"
    :item-text="name"
    :item-value="cityCode"
    @input="onInput">
  </select-comp>
</template>

<script>
    import VSelect from '../vuetify/VSelect';

    export default {
        name: 'city-select-comp',
        extends: VSelect,
        props: {
          id: {
            type: String,
            default: '',
          },
          cityList: {
            type: Array,
              default: () => { return [] }
            },
        },
        methods: {
          onInput() {
            //Nothing special, just $emit'ing the event to the parent
          },
        },
    }
</script>

这个组件的所有功能都很好,除了当我打开我的开发工具时,我会收到一堆控制台错误,所有这些错误都是这样说的(或类似的事情):

无法读取未定义的属性“$refs”

我怎样才能修复这片红海?