vue - 滑动页面使el-select的选择项不超出页面而自动隐藏
2020-08-24 •
25 条评论
mounted() {
console.log('mounted');
let that = this;
window.addEventListener('scroll', function (e) {
that.scrollFunc();
}, true);
},
destroyed() {
window.removeEventListener('scroll', this.scrollFunc);
},
methods: {
scrollFunc() {
// let header = document.getElementsByClassName('has-gutter')[0];
let header = $('.has-gutter');
let header_offset = header.offset();
let header_top = +header_offset.top + 50;
if(this.select === undefined || this.select === null || this.select === ''){
return false;
}
let ref = this.$refs[this.select.id][0] || null;
$('.el-select-dropdown').each(function (e) {
if($(this).css('display') === 'none'){
}else{
let el_select_dropdown = this;
let el_select_dropdown_offset_top = el_select_dropdown.offsetTop;
if(+el_select_dropdown_offset_top <= +header_top){
console.log('小于了');
ref && ref.blur();
// $(this).css('display', 'none');
// ref.$refs.input.blur();
}
}
});
},
}