JS属性方法记录

文件流接口报错格式化

scroll方法

滚动条触发事件

绑定事件

scrollFN (e) {
 let scrollTop = e.target.scrollTop
 let clientHeight = e.target.clientHeight
 let scrollHeight = e.target.scrollHeight
 if(scrollHeight > clientHeight && scrollTop + clientHeight === scrollHeight) {
   this.pageIndex++
   if (this.pageIndex > this.pageTotalSize) return
   this.getEventLog()
 }
}

let dom = document.getElementById('customTimeLine')
dom.addEventListener('scroll', this.scrollFN)

判断是否滚动到底部

scrollFN (e) {
   let scrollTop = e.target.scrollTop
   let clientHeight = e.target.clientHeight
   let scrollHeight = e.target.scrollHeight
   if(scrollHeight > clientHeight && scrollTop + clientHeight === scrollHeight) {
     console.log('query')
   }
 }

移出滚动条事件

let dom = document.getElementById('customTimeLine')
dom.removeEventListener('scroll', this.scrollFN)

注意：addEventListener 中绑定的函数只能是定义在methods中的函数，才能使用removeEventListener移出，addEventListener使用匿名无法移出

resize方法

浏览器窗口大小改变时触发
用法1：

window.onresize = () => {
	console.log('123')
}

用法2：

window.addEventListener('resize', () => {
	console.log('123')
})

计算元素到body的距离

document.querySelector('.spr-dialog').getBoundingClientRect()

锚点定位

document.querySelector('class/id').scrollIntoView(true)

async await

异步代码同步执行

不使用async await

function asyncFN () {
    setTimeout(() => {
        console.log(222)
    }, 2000)
}

function test () {
    asyncFN()
    console.log(111)
}

test()

输出结果

使用后效果

function asyncFN () {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            console.log(222)
            resolve(true)
        })
    })
}

async function test () {
    await asyncFN()
    console.log(111)
}

test()

js下载文件流并模拟a标签点击事件

// res 为后台返回的结果
var blob = res.data
var reader = new FileReader()
reader.readAsDataURL(blob)
reader.onload = function(e) {
	var a = document.createElement('a')
    // 获取文件名fileName
    var fileName = res.headers["content-disposition"].split("=")
    fileName = fileName[fileName.length - 1]
    fileName = fileName.replace(/"/g, "")
    a.download = fileName
    a.href = e.target.result
    document.body.appendChild(a)
    a.click()
    document.body.removeChild(a)
}