vue组件之间继承

Question

想要一个能够继承父类，调用公共方法以及获取公共参数那些的功能

首先是根据一个类型定位到具体的组件 Page.vue

<template>
 <div>
   测试页面
   <component :is="page"></component>
</div>
</template>

<script>
import AddPage from './AddPage'
export default {
  name: 'Page',
  props: [],
  data () {
    return {
      page: 'AddPage'
    }
  },
  components: {
    AddPage
  },
  mounted () {

  }
}
</script>

然后有个基类 Base.vue

<template>
 <div>
   base
</div>
</template>

<script>
export default {
  name: 'Base',
  props: [],
  data () {
    return {

    }
  },
  methods: {
    save () {
      console.log('b save')
    }
  },
  mounted () {
    console.log('base mounted')
  }
}
</script>

然后是我的实现类 AddPage.vue

<template>
 <div>
   add
</div>
</template>

<script>

import Base from 'Base'

export default {
  name: 'AddPage',
  extends: Base,
  props: [],
  data () {
    return {

    }
  },
  mounted () {
    console.log('add mounted')
  }
}
</script>

请问下这么用extends继承有什么问题吗？我执行的时候报错如下

found in

---> <Page> at src/page/Page.vue

Answer 1

import Base from 'Base'

改成

import Base from './Base'