面试必问题——项目中遇到过的问题及解决方案

问题一：chrome iframe跨域设置不了cookie。

原因：因为chrome升级80之后，sameSite默认为Lax.

解决：设置sameSite为None，Secure(secure必须设置不然无效)

问题二：safari跨域不能设置cookie

原因：未知

解决：方法一：先打开页面，设置上有cookie，这时候再跨域设置就可以。方法二：window.open(url)。定时关闭，通过这种方式加载去设置cookie

问题三：弹框点击确定，冒泡到下一层

解决：设置弹框的层级index:9999

问题四：Uncaught SyntaxError: Unexpected token '<'

原因：嵌套路由打包后作为根目录，导致public下的文件跑里面去了

解决方案：在引用路径前添加 <%= BASE_URL %> 默认根目录'/'

问题五：v-if切换组件不更新

原因：可能原因是Vue识别到是相似组件（高度相似甚至相同）不会更新元素。

解决：给俩个高度相似的组件分别加上不同的key值让Vue识别为不同的组件。（我是用的时间戳来区分的）。此处应了解vue元素渲染，Key值的重要性。

问题六：input输入框active状态显示黑色边框

解决：

input {
    outline: none; /*解决active状态显示黑色边框*/
}

问题七：vue绑定键盘事件不起作用。

解决：

@keyup.delete='deleteKeyup(e)'  // 无效

@keyup.delete.native='deleteKeyup(e)'  //无效

在mounted方法里面监听案件绑定
this.$nextTick(()=>{
    document.onkeydown=(e)=>{
       if(e.keyCode == 46){//这是delete健，当然也可以根据自己的需求更改
          this.deleteKeyup()//操作方法
       }
    }
})