Commit 345c6863bf79e995b25274ba03ff3523867703bc

Authored by 梁灏
1 parent 762c8ddf

update Breadcrumb

support router and replace
examples/routers/breadcrumb.vue
... ... @@ -8,7 +8,7 @@
8 8 <div>
9 9 <Breadcrumb separator="<b class='demo-breadcrumb-separator'>=></b>">
10 10 <Breadcrumb-item href="/">Home4</Breadcrumb-item>
11   - <Breadcrumb-item href="/components/breadcrumb">Components</Breadcrumb-item>
  11 + <Breadcrumb-item href="/checkbox" replace>Components</Breadcrumb-item>
12 12 <Breadcrumb-item>Breadcrumb</Breadcrumb-item>
13 13 </Breadcrumb>
14 14 <Breadcrumb separator="">
... ...
src/components/breadcrumb/breadcrumb-item.vue
1 1 <template>
2 2 <span>
3   - <a v-if="href" :href="href" :class="linkClasses">
  3 + <a v-if="href" :class="linkClasses" @click="handleClick">
4 4 <slot></slot>
5 5 </a>
6 6 <span v-else :class="linkClasses">
... ... @@ -20,6 +20,10 @@
20 20 props: {
21 21 href: {
22 22 type: String
  23 + },
  24 + replace: {
  25 + type: Boolean,
  26 + default: false
23 27 }
24 28 },
25 29 data () {
... ... @@ -28,9 +32,6 @@
28 32 showSeparator: false
29 33 };
30 34 },
31   - mounted () {
32   - this.showSeparator = this.$slots.separator !== undefined;
33   - },
34 35 computed: {
35 36 linkClasses () {
36 37 return `${prefixCls}-link`;
... ... @@ -38,6 +39,19 @@
38 39 separatorClasses () {
39 40 return `${prefixCls}-separator`;
40 41 }
  42 + },
  43 + mounted () {
  44 + this.showSeparator = this.$slots.separator !== undefined;
  45 + },
  46 + methods: {
  47 + handleClick () {
  48 + const isRoute = this.$router;
  49 + if (isRoute) {
  50 + this.replace ? this.$router.replace(this.href) : this.$router.push(this.href);
  51 + } else {
  52 + window.location.href = this.href;
  53 + }
  54 + }
41 55 }
42 56 };
43 57 </script>
... ...