vue如何在获取焦点时禁止滚动条滚动

您好，可以通过监听`focus`事件和`blur`事件来实现在获取焦点时禁止滚动条滚动。具体实现可以参考以下示例：

<template>
  <div ref="wrapper" class="wrapper" @focus="handleFocus" @blur="handleBlur">
    <div class="content">
      <!-- 这里放置您的内容 -->
    </div>
  </div>
</template>

<script>
export default {
  methods: {
    handleFocus() {
      this.$refs.wrapper.style.overflow = 'hidden';
    },
    handleBlur() {
      this.$refs.wrapper.style.overflow = 'auto';
    },
  },
};
</script>

<style>
.wrapper {
  height: 300px;
  overflow: auto; /* 设置为auto或scroll */
}
.content {
  height: 600px;
}
</style>

在上面的示例中，我们在包含内容的外层`div`元素上监听了`focus`事件和`blur`事件，并在事件处理程序中分别将`overflow`属性设置为`hidden`和`auto`，以禁止或允许滚动条滚动。需要注意的是，为了实现滚动条，我们在外层`div`元素上设置了`overflow`属性为`auto`或`scroll`。您可以根据您的实际需求进行修改。希望这能够帮助到您。