vue - codemirror 点击对应标签查找 结束标签 位置

 

template ：

<codemirror :value="code" @cursorActivity="cursorActivity"></codemirror>

"cursorActivity" (doc: CodeMirror.Doc)  每当此文档中的光标或选择更改时触发。

import：（必须引入）

import CodeMirror from 'codemirror/lib/codemirror'

methods： 

    cursorActivity (cm) {
      let cur = cm.getCursor()
      this.getPositionTag(cm, cur)
    },
    getPositionTag (cm, cur) {
      let range = cm.getViewport()
      range.from = Math.min(range.from, cur.line)
      range.to = Math.max(cur.line + 1, range.to)
      this.CodeMirror = CodeMirror
      // 获取开始-结束标签位置
      let match = CodeMirror.findMatchingTag(cm, cur, range)
      if (match) {
        let {open, close} = match
        // 获取开始 结束标签的文本
        console.log(cm.getRange(open.from, close ? close.to : open.to))
      }
    }

 

 Console：

根据 最终match 给的 open 和 close 数据 进行定位