<template>
    <div class="e-crumbs__item">
      <span ref="link" :class="['e-crumbs__item__text', to ? 'isLink' : '']"><slot></slot></span>
      <i class="e-font" :class="`e-font-${$parent.icon}`" v-if="$parent.icon"></i>
      <i class="e-crumbs__item__separator" v-else-if="$parent.separator">{{$parent.separator}}</i>
    </div>
</template>

<script>
  export default{
    name:'emmm-crumbs-item',
    props:{
      to:{},
      replace: Boolean
    },
    mounted(){
      var _this=this;
      _this.$nextTick(() => {
        if(_this.to){
          let link=_this.$refs.link;
          link.addEventListener('click', _=> {
            let to = this.to;
            // 根据replace的值决定是replace还是push
            _this.replace ? _this.$router.replace(to) : _this.$router.push(to);
          });
        }
      })
    }
  }
</script>
<style lang="postcss">

</style>
