vue2 如何用 js给获取到的dom绑定按键修饰符

在 Vue2 中，可以使用 `$el` 属性来获取到 DOM 元素，然后使用原生的 `addEventListener` 方法来绑定键盘事件，并在回调函数中处理按键修饰符。具体方式如下：

1. 在 Vue 组件中，通过 `$refs` 属性获取到需要绑定事件的 DOM 元素，如下所示：

<template>
  <div ref="myDiv"></div>
</template>

export default {
  mounted() {
    const myDiv = this.$refs.myDiv;
    myDiv.addEventListener('keydown', this.onKeyDown);
  },
  methods: {
    onKeyDown(event) {
      if (event.keyCode === 13 && event.ctrlKey) {
        // 处理按下 Ctrl + Enter 的情况
      }
    }
  }
}

在 `mounted` 生命周期钩子函数中，通过 `$refs` 属性获取到了 `myDiv` 元素，并使用 `addEventListener` 方法给它绑定了 `keydown` 事件，并指定了事件处理函数 `onKeyDown`。

2. 在事件处理函数中，使用 `event` 参数来获取按键修饰符，如下所示：

export default {
  mounted() {
    const myDiv = this.$refs.myDiv;
    myDiv.addEventListener('keydown', this.onKeyDown);
  },
  methods: {
    onKeyDown(event) {
      if (event.keyCode === 13 && event.ctrlKey) {
        // 处理按下 Ctrl + Enter 的情况
      }
    }
  }
}

这里的 `event` 参数是事件对象，其中包含了按键代码和按键修饰符等信息。在处理函数中，可以根据需要来判断按下的键和修饰符，并做出相应的处理。