遇到的小问题
一、右键点击事件
右键获取鼠标位置，并把当前鼠标位置给右键事件弹窗
### // html// jsdata() {
return {
isShow: false,
left: 0,
right: 0
}
}
handleClick(e) {
console.log(e) // e为当前源
this.top = e.clientY
this.left = e.clinetX
this.isShow = true
}上面的例子可以右键可以显示自定义的弹窗，但是
点击body关闭弹窗事件还没有，以及在谷歌和ie中，这个div定位的父级位置也不同，谷歌是基于dialog左上角为0点定位，ie浏览器是基于html左上角为0点定位。跟踪鼠标点击位置，显示dom，点击body后隐藏。
// js
closeClick(e) {
this.isShow = false
}
// 监听页面点击事件
watch: {
isShow(value) {
if (value) {
document.body.addEventListener('click', this.closeClick)
} else {
document.body.removeEventListener('click', this.closeClick)
}
}
}由于dom定位的基准不同，因此对不同的浏览器进行兼容
handleClick(e) {
console.log(e) // e为当前源
let boxDom = $('mode-diag .el-dialog').offset() // 获取dialog偏移量，在谷歌浏览器需减去偏移量
let isChrome = navigator.userAgent.indexOf('Chrome') > -1;
if (isChrome) {
this.top = e.clientY - boxDom.top
this.left = e.clinetX - boxDom.left
} else {
// 如果右键的位置有滚动条，ie得需要减去滚动条的距离
let scrollX = document.documentElement.scrollLeft || document.body.scrollLeft
let scrollY = document.documentElement.scrollTop || document.body.scrollTop
this.top = e.pageY - scrollY || e.clientY
this.left = e.pageX - scrollX || e.clinetX
}
this.isShow = true
}二、内容滚动条
页面的宽度由内容撑开，同时兼容浏览器。
1、inline-block
内容内容。。。。
.demo {
width: max-content;
// ie不兼容
display: inline-block
}2、absolute
【前端-浏览器兼容】内容内容。。。。
.demo {
position: absolute;
left: 10px;
top: 10px;
width: auto;
height: auto;
}三、vuex执行顺序
进入页面需调用搜索接口，获取到返回的数据，同时设置在vuex内，页面通过获取store数据作为接口的传参。
但是目前页面设置tab切换，重新设置vuex时，由于进入页面直接请求接口，通过mapState数据获取时，执行顺序比vuex快，因此再调接口时可添加
this.$nextTick或者async await四、表单下拉框数据联动
小知识 总结
