element tree 深度查詢


  searchTree () {
      this.keys = []
      this.filterLabel()
    },

    // 過濾標簽樹
    filterLabel (value, data) {
      // ''空字符串是查詢全部
      if (this.searchLabel.trim() === '') {
        this.treeDataTemp = Array.from(this.treeData)
        this.keys = Array.from(this.defaultExpendKeys)
        this.$refs['left'].scrollTo({ y: 0 })
        return
      }
      let res = this.variableDeepSearch(this.treeData, this.searchLabel.trim()) // res是過濾后得到的數據

      let temp = [] // 存放包含關鍵字的標簽  和  包含關鍵字的分類標簽的父級key
      if (this.keys.length > 20) {
        this.$message.warning('匹配到的數據太多,請自行展開')
        this.keys = this.defaultExpendKeys // 太多直接是不展開
      } else {
        this.keys.forEach(item => {
          let node = this.$refs.tree.getNode(item)
          if (node.isLeaf) {
            temp.push(item) // 如果是葉子節點的話必須得展開
          } else {
            temp.push(node.parent.key) // 如果不是葉子節點那么展開它的父級
          }
        })
        this.keys = temp
      }
      this.treeDataTemp = Array.from(res)
      this.$refs['left'].scrollTo({ y: 0 }) // 搜索后滾動到頂部
    },

    // treeDataFilter標簽樹數據,searchWord搜素關鍵字
    variableDeepSearch (treeData, searchWord) {
      let childTemp = []

      treeData.forEach(element => {
        if (element.label.indexOf(searchWord) > -1) {
          childTemp.push(element)
          // 匹配到關鍵字並且key中還沒存在他的父級
          if (!element.key.includes(this.keys[this.keys.length - 1])) {
            this.keys.push(element.key)
          }
        }
        if (element.children && element.children.length) {
          const childSearch = this.variableDeepSearch(element.children, searchWord)
          const childObj = {
            ...element,
            children: childSearch
          }
          if (childSearch && childSearch.length) {
            childTemp.push(childObj)
            let index = childTemp.indexOf(element)
            if (index > -1) {
              childTemp.splice(index, 1)
            }
          }
        }
      })
      return childTemp
    },

  


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM