首頁猿問 vuejs...

vuejs 失去焦點(diǎn)，單擊全局隱藏某些浮動(dòng)元素

JavaScript

精慕HU 2018-08-27 12:14:29

先看圖，我們想實(shí)現(xiàn)一個(gè)這樣的功能，單擊高級搜索，彈出一個(gè)div，div里面是slot進(jìn)去的，有各種標(biāo)簽，包括表單元素。再單擊其他區(qū)域，會隱藏這個(gè)彈出的div，類似blur事件。麻煩給點(diǎn)思路實(shí)現(xiàn)這個(gè)組件（功能），寫一個(gè)這樣的組件，彈出框的內(nèi)容slot進(jìn)去，里面的表單可以進(jìn)行操作輸入，以及動(dòng)態(tài)渲染dom結(jié)點(diǎn)。請問有朋友實(shí)現(xiàn)過類似的功能嗎，麻煩給點(diǎn)思路。

查看完整描述

1 回答

鴻蒙傳說

TA貢獻(xiàn)1865條經(jīng)驗(yàn) 獲得超7個(gè)贊

created() {    // 點(diǎn)擊其他不在的區(qū)域觸發(fā)事件    document.addEventListener('click', (e) => {      
console.log(this.$el.contains(e.target));      if (!this.$el.contains(e.target)){          this.isShowDialog = false; 
      }
    })
  }

寫到你組件里

2 反對回復(fù) 2018-10-28