<template>
    <view :class="'categoryLv' + index">
        <view class=" method_content_divider"></view>                    
        <category :contentList="categoryLv1" level="level1" ref="categorylevel1"></category>
        <!-- 二级标题 -->
        <view v-if="categoryLv1.categoryLv2">
            <view v-for="(categoryLv2,index) in categoryLv1.categoryLv2" :key="index">
                <category :contentList="categoryLv2" level="level2" ref="categorylevel2"></category>  
                <!-- 三级标题  -->
                <view v-if="categoryLv2.categoryLv3">
                    <view v-for="(categoryLv3,index) in categoryLv2.categoryLv3" :key="index">
                        <category :contentList="categoryLv3" level="level3" ref="categorylevel3"></category>
                        <!-- 四级标题 -->
                        <view v-if="categoryLv3.categoryLv4">
                            <view v-for="(categoryLv4,index) in categoryLv3.categoryLv4" :key="index">
                                <category :contentList="categoryLv4" level="level4" ref="categorylevel4"></category>           
                            </view>
                        </view>        
                    </view>
                </view>   
            </view>
        </view>
    </view>
</template>
<script>
import category from './category';

export default {
    config: {
        component: true
    },
    props: ['categoryLv1', 'index'],
    data() {
        return {
            // env: 'swan',
        };
    },
    components: {
        'category': category,
    },
    watch: {
    },
    created() {

    },
    mounted() {
        // console.log(this.$refs);
    },
    methods: {
        
    },
};
</script>
<style lang="less" scoped>
.method_content_divider{
    margin: 0.10rem 0 0.1rem 0;
}
</style>