Commit eaaea36a03013b9ba0fb13d6b023fc313977d778
Committed by
GitHub
GitHub
Merge pull request #81 from jingsam/simplify-backtop
simpilfy back-top.vue
Showing
2 changed files
with
5 additions
and
25 deletions
Show diff stats
src/components/back-top/back-top.vue
| @@ -10,19 +10,6 @@ | @@ -10,19 +10,6 @@ | ||
| 10 | <script> | 10 | <script> |
| 11 | const prefixCls = 'ivu-back-top'; | 11 | const prefixCls = 'ivu-back-top'; |
| 12 | 12 | ||
| 13 | - function getScroll(target, top) { | ||
| 14 | - const prop = top ? 'pageYOffset' : 'pageXOffset'; | ||
| 15 | - const method = top ? 'scrollTop' : 'scrollLeft'; | ||
| 16 | - | ||
| 17 | - let ret = target[prop]; | ||
| 18 | - | ||
| 19 | - if (typeof ret !== 'number') { | ||
| 20 | - ret = window.document.documentElement[method]; | ||
| 21 | - } | ||
| 22 | - | ||
| 23 | - return ret; | ||
| 24 | - } | ||
| 25 | - | ||
| 26 | export default { | 13 | export default { |
| 27 | props: { | 14 | props: { |
| 28 | height: { | 15 | height: { |
| @@ -72,14 +59,7 @@ | @@ -72,14 +59,7 @@ | ||
| 72 | }, | 59 | }, |
| 73 | methods: { | 60 | methods: { |
| 74 | handleScroll () { | 61 | handleScroll () { |
| 75 | - const backTop = this.backTop; | ||
| 76 | - const scrollTop = getScroll(window, true); | ||
| 77 | - | ||
| 78 | - if (this.height <= scrollTop && !backTop) { | ||
| 79 | - this.backTop = true; | ||
| 80 | - } else if (this.height > scrollTop && backTop) { | ||
| 81 | - this.backTop = false; | ||
| 82 | - } | 62 | + this.backTop = window.pageYOffset >= this.height; |
| 83 | }, | 63 | }, |
| 84 | back () { | 64 | back () { |
| 85 | window.scrollTo(0, 0); | 65 | window.scrollTo(0, 0); |
| @@ -87,4 +67,4 @@ | @@ -87,4 +67,4 @@ | ||
| 87 | } | 67 | } |
| 88 | } | 68 | } |
| 89 | } | 69 | } |
| 90 | -</script> | ||
| 91 | \ No newline at end of file | 70 | \ No newline at end of file |
| 71 | +</script> |
test/routers/more.vue
| @@ -50,9 +50,9 @@ | @@ -50,9 +50,9 @@ | ||
| 50 | <div @click="spinShow = !spinShow">消失</div> | 50 | <div @click="spinShow = !spinShow">消失</div> |
| 51 | <br><br> | 51 | <br><br> |
| 52 | 52 | ||
| 53 | - <Button @click="nextStep">下一步</Button> | ||
| 54 | - <Button @click="step_status = 'error'">步骤3切换为错误</Button> | ||
| 55 | - <Button @click="step_process = 'error'">切换steps状态为error</Button> | 53 | + <i-button @click="nextStep">下一步</i-button> |
| 54 | + <i-button @click="step_status = 'error'">步骤3切换为错误</i-button> | ||
| 55 | + <i-button @click="step_process = 'error'">切换steps状态为error</i-button> | ||
| 56 | <Breadcrumb separator="<b>=></b>"> | 56 | <Breadcrumb separator="<b>=></b>"> |
| 57 | <Breadcrumb-item href="/index">首页</Breadcrumb-item> | 57 | <Breadcrumb-item href="/index">首页</Breadcrumb-item> |
| 58 | <Breadcrumb-item href="/my">我的</Breadcrumb-item> | 58 | <Breadcrumb-item href="/my">我的</Breadcrumb-item> |