输入字段在vue-drag-resize内部不起作用

Question

我正在使用https://github.com/kirillmurashov/vue-drag-resize中的vue-drag-resize。

如果将输入文本字段放在vue-drag调整大小组件内，则无法在其中输入任何文字。有人知道解决方案如何解决此问题吗？

Answer 1

我在 vue 项目中使用 vue-drag-resize npm 时遇到了这个问题。 在 vue-drag-resize 容器中，输入字段不起作用。 所以我用输入焦点功能

修复了它

这是代码示例

<template>
   <VueDragResize>
       <input v-model="name" ref="input" @click="inputClicked" />
   </VueDragResize>
</template>
<script>
...
...
methods: {
    inputClicked() {
        this.$refs.input.focus()
    }
}
</script>

有时，我们会遇到“....focus is not a function”错误。

如果您遇到此错误，请尝试这样

this.$refs.input[0].focus()
this.$refs.input.$el.focus()

任一个都行。

Answer 2

@activated="onActivated"

methods: {
    onActivated() {
        this.$refs['yourinput'].focus();
      }