20 lines
690 B
Plaintext
20 lines
690 B
Plaintext
<template>
|
||
<div class="kole-breadcrumb">
|
||
<!-- Vue 2 不允许在 <template v-for> 上写 :key，key 必须落在真实元素上 -->
|
||
<template v-for="(it, i) in items">
|
||
<span :key="'item-' + i" class="kole-breadcrumb-item" :class="{ 'is-current': i === items.length - 1 }"
|
||
@click="i !== items.length - 1 && $emit('select', it)">{{ it.label }}</span>
|
||
<span v-if="i !== items.length - 1" :key="'sep-' + i" class="kole-breadcrumb-sep">/</span>
|
||
</template>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
name: 'KoleBreadcrumb',
|
||
props: { items: { type: Array, default: function () { return []; } } }
|
||
};
|
||
</script>
|
||
|
||
<style src="./Breadcrumb.css"></style>
|