亚洲激情专区-91九色丨porny丨老师-久久久久久久女国产乱让韩-国产精品午夜小视频观看

溫馨提示×

vue中什么是遞歸組件

vue
清風
481
2021-03-15 12:54:10
欄目: 編程語言

vue中什么是遞歸組件

遞歸所指的是程序自己調用自身,而vue中的遞歸組件就是組件自身調用自身。

實現方法如下:

準備一個父組件存放遞歸數據,再創建一個子組件作為遞歸調用的組件,從而實現遞歸。

1.父組件。

<template>

  <div id="app">

   

    <category :datalist="datalist"></category>

  </div>

</template>

 

<script>

 

import category from './category.vue'

export default {

  name: 'app',

  data () {

    return {

      datalist:[

        {

          title:'手機',

          level:1,

          children:[

            {

              title:'三星',

              level:2,

              children:[  

                  {

                   title:'三星1',

                   level:3

                  }

 

               ]

            },

            {

              title:'華為',

              level:2

            },

            {

              title:'蘋果',

              level:2

            }

          ]

        }

       

    ]

  }

 },

  components:{

    category

  },

  created() {

 

 }

}

</script>

 

<style>

 

</style>

2.子組件。

<template>

  <div id="phone">

 

   <div v-for="(item ,index) in datalist" :key="index">

   {{item.title}}

   <div v-if="item.children" class="item-chilren">

   <phone :datalist="item.children"></phone>

   </div>

   </div>

  

  </div>

</template>

 

<script>

export default {

  name: 'phone',

  data () {

    return {

    }

  },

  props:{

  datalist:Array

  },

  created() {

 

 }

}

</script>

 

<style>

.item-chilren{

}

 

.item-chilren div{

padding: 2px;

padding-left: 20px;

margin-bottom: 2px;

}

</style>


0
措勤县| 房山区| 龙南县| 奉化市| 宁晋县| 玉溪市| 涿州市| 称多县| 永吉县| 运城市| 临高县| 甘南县| 西乡县| 新绛县| 且末县| 宁国市| 弥勒县| 庄河市| 治多县| 绩溪县| 皮山县| 贵德县| 景宁| 响水县| 常熟市| 滦平县| 噶尔县| 吕梁市| 平舆县| 福海县| 永德县| 莒南县| 石台县| 成武县| 舒城县| 岑巩县| 兴山县| 麦盖提县| 吉安县| 敦煌市| 凤冈县|