<script>
    import Vue from 'vue';
    import {Breadcrumb} from 'view-design'
    import FunctionComponent from "../../../libs/utils/FunctionComponent";
    const prefixCls = 'ivu-breadcrumb';
    const _Breadcrumb=Vue.extend({
        name:'HtBaseBreadcrumb',
        extends:Breadcrumb,
        props:{
            themeborder: {
                type: Boolean,
                default: false
            },
            separator: {
                type: String,
                default: '/'
            }
        },
        computed:{
            classes () {
                return [
                    `${prefixCls}`,
                    {
                        [`${prefixCls}-themeborder`]:this.themeborder
                    }
                ];
            },
        },
        mounted () {
            this.updateChildren();
        },
        updated () {
            this.$nextTick(() => {
                this.updateChildren();
            });
        },
        methods: {
            updateChildren () {
                this.$children.forEach((child) => {
                    child.separator = this.separator;
                });
            }
        },
        watch: {
            separator () {
                this.updateChildren();
            }
        }
    });
    export default FunctionComponent(_Breadcrumb,'ht-base-breadcrumb','i')

</script>
