vue点击ul中的li显示弹框，点击其他地方隐藏弹框

注意：ref="seatTipOperation"

<ul
  ref="seatTipOperation"
  v-if="seatTipOperationVisible"
>
  <li @click="handleSeatTipAdd()">添加</li>
  <li @click="handleSeatTipDelect()">删除</li>
  <li @click="handleSeatTipLock()">锁定</li>
  <li @click="handleSeatTipFillIn()">插空</li>
  <li @click="handleSeatTipSocket()">插座</li>
  <li @click="handleSeatTipSwop()">对调</li>
</ul>

handleSeatList () {
  this.seatTipOperationVisible = true
}

mounted () {
  // this的指向问题
  let that = this
  document.addEventListener('click', function (e) {
    // 这里that代表组件，this代表document
    // 冒泡也不会隐藏
    if(!that.$refs.seatTipOperation.contains(e.target)){
      that.seatTipOperationVisible = false
    }
  })
}