first commit
This commit is contained in:
62
vant/packages/vant-cli/site/desktop/components/NavLink.vue
Normal file
62
vant/packages/vant-cli/site/desktop/components/NavLink.vue
Normal file
@@ -0,0 +1,62 @@
|
||||
<template>
|
||||
<router-link
|
||||
v-if="item.path"
|
||||
:class="{ active }"
|
||||
:to="path"
|
||||
v-html="itemName"
|
||||
/>
|
||||
<a v-else-if="item.link" :href="item.link" v-html="itemName" />
|
||||
<a v-else v-html="itemName" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'van-doc-nav-link',
|
||||
|
||||
props: {
|
||||
base: String,
|
||||
item: Object,
|
||||
},
|
||||
|
||||
computed: {
|
||||
itemName() {
|
||||
const name = (this.item.title || this.item.name).split(' ');
|
||||
return `${name[0]} <span>${name.slice(1).join(' ')}</span>`;
|
||||
},
|
||||
|
||||
path() {
|
||||
return `${this.base}${this.item.path}`;
|
||||
},
|
||||
|
||||
active() {
|
||||
if (this.$route.path === this.path) {
|
||||
return true;
|
||||
}
|
||||
|
||||
if (this.item.path === 'home') {
|
||||
return this.$route.path === this.base;
|
||||
}
|
||||
|
||||
return false;
|
||||
},
|
||||
},
|
||||
|
||||
watch: {
|
||||
active() {
|
||||
this.scrollIntoView();
|
||||
},
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.scrollIntoView();
|
||||
},
|
||||
|
||||
methods: {
|
||||
scrollIntoView() {
|
||||
if (this.active && this.$el && this.$el.scrollIntoViewIfNeeded) {
|
||||
this.$el.scrollIntoViewIfNeeded();
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
Reference in New Issue
Block a user