vue.js - 如何防止 v-text-field 上的 TypeError 输入键

问题描述

我有以下带有单个 v-text-field 和一个按钮的 Vuetify 表单：

<v-form v-model="valid" ref="form" @submit.prevent>
      <v-container>
        <v-layout>
          <v-flex
            xs12
            md8
          >
            <v-text-field
              v-model="name"
              :rules="nameRules"
              :counter="max"
              maxlength='max'
              :label="$t('Save new name')"
              required
              clearable
              @keyup.enter.prevent='onEnterPressed'
            ></v-text-field>
          </v-flex>

          <v-flex
            xs12
            md4
          >
            <v-btn
              :loading="saving"
              :disabled="!valid || saving"
              color="info"
              @click="processNewName"
            >
              <v-icon left dark>fa-save</v-icon>
              {{ $t('Save') }}
            </v-btn>
          </v-flex>
        </v-layout>
      </v-container>
    </v-form>

目前这些是我的方法：

onEnterPressed() {
  console.log('enter pressed');
},
processNewName() {
  ...
}

当按下 Enter 按钮时，我正在使用@submit.prevent停止刷新页面。

到目前为止，一切似乎都在工作。但是，当我点击回车按钮时，在控制台中我收到以下错误消息：

Uncaught TypeError: Cannot read property 'type' of undefined
at e.setFieldValue (onloadwff.js:71)
at HTMLFormElement.formKeydownListener (onloadwff.js:71)

在 onloadwff.js 中，错误指向以下代码：

if("password"===r.type)

所以r是未定义的。我怎样才能防止这种情况发生？我已经尝试过使用@keyup.enter.prevent.native，尝试过@keydown.enter.prevent，尝试过指向@submit.prevent方法processNewName...这个错误不断出现。

我在 Vuetify 站点中检查了 v-text-field 组件，似乎有时他们在某些示例中也会出现此错误，但不是全部。但我不知道该怎么做才能防止这种情况发生。有任何想法吗？

编辑

经过进一步调查，我发现它onloadwff.js属于 LastPass 插件。在没有该插件的情况下检查了不同的浏览器，发现一切正常。

标签： vue.jsvuetify.js

vue.js - 如何防止 v-text-field 上的 TypeError 输入键

问题描述

解决方案

推荐阅读