<template>
	<div class="scorll-bar-container">
		<div class="scorll-bar-content" v-for="(item, key) in list">
			<div class="scorll-bar-title">{{item.title}}</div>
			<div class="scorll-bar-group" v-for="(groupItem, key) in item.group">
				<div>{{groupItem.name}}</div>
				<div class="scorll-bar-item" v-for="(pageItem, key) in groupItem.page">
					<router-link active-class="active"
								 :to="base + pageItem.path"
								 v-text="pageItem.name">{{pageItem.name}}
					</router-link>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
    import ScorllBar from './scorll-bar';
    export default ScorllBar;
</script>

<style lang="scss" scoped>
	@import './scorll-bar';
</style>
