update Affix & BackTop
This commit is contained in:
parent
e4767e5a90
commit
2919aa362d
3 changed files with 55 additions and 9 deletions
|
@ -5,8 +5,8 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import { on, off } from '../../utils/dom';
|
||||||
const prefixCls = 'ivu-affix';
|
const prefixCls = 'ivu-affix';
|
||||||
|
|
||||||
function getScroll(target, top) {
|
function getScroll(target, top) {
|
||||||
|
@ -73,12 +73,16 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted () {
|
mounted () {
|
||||||
window.addEventListener('scroll', this.handleScroll, false);
|
// window.addEventListener('scroll', this.handleScroll, false);
|
||||||
window.addEventListener('resize', this.handleScroll, false);
|
// window.addEventListener('resize', this.handleScroll, false);
|
||||||
|
on(window, 'scroll', this.handleScroll);
|
||||||
|
on(window, 'resize', this.handleScroll);
|
||||||
},
|
},
|
||||||
beforeDestroy () {
|
beforeDestroy () {
|
||||||
window.removeEventListener('scroll', this.handleScroll, false);
|
// window.removeEventListener('scroll', this.handleScroll, false);
|
||||||
window.removeEventListener('resize', this.handleScroll, false);
|
// window.removeEventListener('resize', this.handleScroll, false);
|
||||||
|
off(window, 'scroll', this.handleScroll);
|
||||||
|
off(window, 'resize', this.handleScroll);
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
handleScroll () {
|
handleScroll () {
|
||||||
|
|
|
@ -9,6 +9,7 @@
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import { scrollTop } from '../../utils/assist';
|
import { scrollTop } from '../../utils/assist';
|
||||||
|
import { on, off } from '../../utils/dom';
|
||||||
const prefixCls = 'ivu-back-top';
|
const prefixCls = 'ivu-back-top';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
@ -36,12 +37,16 @@
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
mounted () {
|
mounted () {
|
||||||
window.addEventListener('scroll', this.handleScroll, false);
|
// window.addEventListener('scroll', this.handleScroll, false);
|
||||||
window.addEventListener('resize', this.handleScroll, false);
|
// window.addEventListener('resize', this.handleScroll, false);
|
||||||
|
on(window, 'scroll', this.handleScroll);
|
||||||
|
on(window, 'resize', this.handleScroll);
|
||||||
},
|
},
|
||||||
beforeDestroy () {
|
beforeDestroy () {
|
||||||
window.removeEventListener('scroll', this.handleScroll, false);
|
// window.removeEventListener('scroll', this.handleScroll, false);
|
||||||
window.removeEventListener('resize', this.handleScroll, false);
|
// window.removeEventListener('resize', this.handleScroll, false);
|
||||||
|
off(window, 'scroll', this.handleScroll);
|
||||||
|
off(window, 'resize', this.handleScroll);
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
classes () {
|
classes () {
|
||||||
|
|
37
src/utils/dom.js
Normal file
37
src/utils/dom.js
Normal file
|
@ -0,0 +1,37 @@
|
||||||
|
import Vue from 'vue';
|
||||||
|
|
||||||
|
const isServer = Vue.prototype.$isServer;
|
||||||
|
|
||||||
|
/* istanbul ignore next */
|
||||||
|
export const on = (function() {
|
||||||
|
if (!isServer && document.addEventListener) {
|
||||||
|
return function(element, event, handler) {
|
||||||
|
if (element && event && handler) {
|
||||||
|
element.addEventListener(event, handler, false);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
return function(element, event, handler) {
|
||||||
|
if (element && event && handler) {
|
||||||
|
element.attachEvent('on' + event, handler);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
})();
|
||||||
|
|
||||||
|
/* istanbul ignore next */
|
||||||
|
export const off = (function() {
|
||||||
|
if (!isServer && document.removeEventListener) {
|
||||||
|
return function(element, event, handler) {
|
||||||
|
if (element && event) {
|
||||||
|
element.removeEventListener(event, handler, false);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
return function(element, event, handler) {
|
||||||
|
if (element && event) {
|
||||||
|
element.detachEvent('on' + event, handler);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
})();
|
Loading…
Add table
Reference in a new issue