extends继承

2022/8/11 extendsVue3

extends继承

# extends继承

组件一

<template>
  <div class="add" @click="add">{{name}}</div>
</template>

<script>
import one from "./views/one.vue";
export default {
  extends: one,
  components: {
    one,
  },
  data() {
    return {
      isShow: true,
    };
  },
  mounted() {},
};
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

组件二

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

<script>
export default {
  data() {
    return {
      name: "XuTao",
    };
  },

  methods: {
    add() {
      console.log("被点击了");
    },
  },
};
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19