vue-cli中组件自己嵌套自己

版权声明: https://blog.csdn.net/lhjuejiang/article/details/82116612

其实不难,确切说很简单,先看一下官网中的name作用

name

  • 类型string

  • 限制:只有作为组件选项时起作用。

  • 详细

    允许组件模板递归地调用自身。注意,组件在全局用 Vue.component() 注册时,全局 ID 自动作为组件的 name。

    指定 name 选项的另一个好处是便于调试。有名字的组件有更友好的警告信息。另外,当在有 vue-devtools,未命名组件将显示成 <AnonymousComponent>,这很没有语义。通过提供 name 选项,可以获得更有语义信息的组件树。

我们知道使用vue-cli每创建一个组件的时候,在导出对象中就会自动生成一个name属性,如果我们想要在该组件中嵌套本身,那么直接就可以在模板中使用name属性值 递归调用自身

例如:当我们创建一个组件CustomList时,会自动生成:name:"custom-list",递归调用自身如下:

<template>
  <div>
    //递归调用自己
     <custom-list></custom-list>
  </div>
</template>

<script>
  export default {
   name:"custom-list"
  }
</script>

猜你喜欢

转载自blog.csdn.net/lhjuejiang/article/details/82116612