Interview questions-problems encountered in the project and solutions

Problem 1: Chrome iframe cannot set cookies across domains.

Reason: After the chrome upgrade to 80, the sameSite defaults to Lax.

Solution: Set the sameSite to None, Secure (secure must be set otherwise it is invalid)

Problem 2: Safari cannot set cookies across domains

Cause: Unknown

Solution: Method 1: Open the page first, and there are cookies in the settings, then cross-domain settings are fine. Method 2: window.open(url). Timed off, load in this way to set cookies

Question 3: Click OK in the pop-up box to bubble to the next layer

Solution: set the level index of the bullet frame: 9999

Question 4: Uncaught SyntaxError: Unexpected token'<'

Reason: The nested route is packaged as the root directory, which causes the files under public to run inside

Solution: add <%= BASE_URL %>  default root directory'/' before the reference path 

Question 5: The v-if switch component does not update

Reason: The possible reason is that Vue recognizes similar components (highly similar or even the same) and will not update the elements.

Solution: Add different key values ​​to two highly similar components so that Vue can recognize them as different components. (I use the timestamp to distinguish). Here you should understand the importance of vue element rendering and the key value.

Question 6: The input box displays a black frame in the active state

solve:

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

Question 7: Vue binding keyboard events does not work.

solve:

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

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

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