指令 v-focus on one input 为什么输入字段的其余部分无法在 vue js 中正确输入

Question

当我尝试在单击按钮时专注于单个输入字段时，该输入字段将始终处于焦点状态如果我尝试在 keyup 上插入一个词，我将无法在第二个输入字段中输入数据，它将聚焦到第一个字段

<div id="app">
   <md-field>
      <label>Value 1</label>
      <md-input v-model="initial" v-focus :disabled="valDisabled"></md-input>
    </md-field>
    <md-field>
      <label>Value 2</label>
      <md-input v-model="type" :disabled="valDisabled"></md-input>
    </md-field>

    <md-button class="md-raised md-primary" id="btnAddMore" v-on:click="SubmitButton">Submit</md-button>
  </div>
<script>

Vue.directive('focus', {
    inserted: function (el) {
        el.focus();
    },
    update: function (el) {
        Vue.nextTick(function() {
            el.focus();
        })
    }
})
var app = new Vue({
    el: '#app',
    data: function () {
        return {
          initial: "",
          type: "",
          valDisabled: true
        };
    },
method:funtion(){
SubmitButton:funtion(){
    this.valDisabled = false;
}
},
</script>

请帮忙

Answer 1

如果没有任何效果，请使用老式的 js 方式，在输入元素上使用 "id"，然后在 SubmitButton 上单击给予元素焦点。

1) html: <md-input v-model="initial" id="someid" :disabled="valDisabled" ></md-input>

2)

SubmitButton () {
  this.valDisabled = false;

  // nextTick is used to bring valDisabled change into effect.
  // Otherwise, it won't get focus.
  this.$nextTick(() => {
    document.getElementById("someid").focus();
  });
}

在这种情况下不需要 v-focus 指令。

指令 v-focus on one input 为什么输入字段的其余部分无法在 vue js 中正确输入

Directive v-focus on one input why rest of the input field is not able to type properly in vue js

vue.js

vue-material