Commit 576329cc63bfd6f32d7f176d177cf4a7199fc436
1 parent
25257337
use link.js for anchor
Showing
3 changed files
with
15 additions
and
17 deletions
Show diff stats
src/components/anchor/anchor-link.vue
... | ... | @@ -5,9 +5,11 @@ |
5 | 5 | </div> |
6 | 6 | </template> |
7 | 7 | <script> |
8 | +import mixinsLink from '../../mixins/link'; | |
8 | 9 | export default { |
9 | 10 | name: 'AnchorLink', |
10 | 11 | inject: ['anchorCom'], |
12 | + mixins: [ mixinsLink ], | |
11 | 13 | props: { |
12 | 14 | href: String, |
13 | 15 | title: String |
... | ... | @@ -31,8 +33,10 @@ export default { |
31 | 33 | } |
32 | 34 | }, |
33 | 35 | methods: { |
34 | - goAnchor () { | |
35 | - this.anchorCom.turnTo(this.href); | |
36 | + goAnchor (event) { | |
37 | + this.currentLink = this.href; | |
38 | + this.$emit('on-select', this.href); | |
39 | + this.handleCheckClick(event); | |
36 | 40 | } |
37 | 41 | }, |
38 | 42 | mounted () { | ... | ... |
src/components/anchor/anchor.vue
... | ... | @@ -25,7 +25,6 @@ export default { |
25 | 25 | prefix: 'ivu-anchor', |
26 | 26 | isAffixed: false, // current affixed state |
27 | 27 | inkTop: 0, |
28 | - linkHeight: 0, | |
29 | 28 | animating: false, // if is scrolling now |
30 | 29 | currentLink: '', // current show link => #href -> currentLink = #href |
31 | 30 | currentId: '', // current show title id => #href -> currentId = href |
... | ... | @@ -83,13 +82,6 @@ export default { |
83 | 82 | const scrollTop = document.documentElement.scrollTop || document.body.scrollTop || e.target.scrollTop; |
84 | 83 | this.getCurrentScrollAtTitleId(scrollTop); |
85 | 84 | }, |
86 | - turnTo (href) { | |
87 | - this.currentLink = href; | |
88 | - this.$router.push({ | |
89 | - path: href | |
90 | - }); | |
91 | - this.$emit('on-select', href); | |
92 | - }, | |
93 | 85 | handleHashChange () { |
94 | 86 | const url = window.location.href; |
95 | 87 | const sharpLinkMatch = sharpMatcherRegx.exec(url); |
... | ... | @@ -159,8 +151,7 @@ export default { |
159 | 151 | off(window, 'hashchange', this.handleHashChange); |
160 | 152 | }, |
161 | 153 | init () { |
162 | - const anchorLink = findComponentDownward(this, 'AnchorLink'); | |
163 | - this.linkHeight = anchorLink ? anchorLink.$el.getBoundingClientRect().height : 0; | |
154 | + // const anchorLink = findComponentDownward(this, 'AnchorLink'); | |
164 | 155 | this.handleHashChange(); |
165 | 156 | this.$nextTick(() => { |
166 | 157 | this.removeListener(); |
... | ... | @@ -178,7 +169,9 @@ export default { |
178 | 169 | watch: { |
179 | 170 | '$route' () { |
180 | 171 | this.handleHashChange(); |
181 | - this.handleScrollTo(); | |
172 | + this.$nextTick(() => { | |
173 | + this.handleScrollTo(); | |
174 | + }) | |
182 | 175 | }, |
183 | 176 | container () { |
184 | 177 | this.init(); | ... | ... |
src/mixins/link.js
... | ... | @@ -26,14 +26,15 @@ export default { |
26 | 26 | methods: { |
27 | 27 | handleClick () { |
28 | 28 | const isRoute = this.$router; |
29 | + let href = this.to || this.href; | |
29 | 30 | if (isRoute) { |
30 | - this.replace ? this.$router.replace(this.to) : this.$router.push(this.to); | |
31 | + this.replace ? this.$router.replace(href) : this.$router.push(href); | |
31 | 32 | } else { |
32 | - window.location.href = this.to; | |
33 | + window.location.href = href; | |
33 | 34 | } |
34 | 35 | }, |
35 | 36 | handleCheckClick (event) { |
36 | - if (this.to) { | |
37 | + if (this.to || this.href) { | |
37 | 38 | if (this.target === '_blank') { |
38 | 39 | return false; |
39 | 40 | } else { |
... | ... | @@ -43,4 +44,4 @@ export default { |
43 | 44 | } |
44 | 45 | } |
45 | 46 | } |
46 | -}; | |
47 | 47 | \ No newline at end of file |
48 | +}; | ... | ... |