javascript - 按 Enter 键将事件附加到 “v-btn”

标签 javascript vue.js vuetify.js

除了按回车键需要帮助之外,一切正常。 我有 форму ввода v-checkbox

   <v-expansion-panel>
    <v-expansion-panel-header disable-icon-rotate @click="editingTarget" class="headerHeight">
        <span class="title"> {{description.targets}}</span>
        <template v-slot:actions>
            <v-btn fab small>
                <v-icon v-if="isEditing.target">mdi-close</v-icon>
                <v-icon v-else>mdi-pencil</v-icon>
            </v-btn>
        </template>
    </v-expansion-panel-header>
    <p class="subtitle-1  px-6" style="opacity: 0.9" v-if="(profileDetails) && (!isEditing.target)">
        {{profileDetails.target}}</p>
    <v-expansion-panel-content
    >
        <v-row>
            <v-col xs="12"
                   md="6"
                   lg="6"
                   v-for="(item, i) in valueCheckBox"
                   :key="i"
                   class="colCheckBox"
            >
                <div style="width: 250px">
                    <v-checkbox v-model="checkBox" :value="item.value">
                        <template v-slot:label>
                            <div class="check-box-custom">
                                <span class="font-weight-regular">{{item.value}}</span>
                            </div>
                        </template>
                    </v-checkbox>
                </div>
            </v-col>
        </v-row>
        <v-card-actions>
            <div class="flex-grow-1"></div>
                <v-btn
                        color="blue lighten-1"
                        @click="$emit('close-panel', []); save()"
                >
                    Save
                </v-btn>
        </v-card-actions>
    </v-expansion-panel-content>
   </v-expansion-panel>

我没有“输入”,“表单”,如果我在表单上输入任何信息我会成功,但没有表单

        methods: {
        ...mapActions(['editAbout']),

        save() {
            this.isEditing.target = false

            const target = this.checkBox.join(", ")
            if (target !== profileDetails.target) {

                const obj = {
                    name: 'target',
                    profileDet: {
                        id: profileDetails.id,
                        target: target
                    }
                }
                this.editAbout(obj)
            }
        },

什么只是没有尝试?!我什么都想,但不知何故我不能 我只是无法将事件附加到 Enter 键 救命!!!

最佳答案

尝试在相应标签(即 v-text-field)中使用 @keydown.enter.native.stop.prevent="event" 属性来触发释放回车键后的event()

就您的情况而言,如下所示:

<v-checkbox @keydown.enter.native.stop.prevent="$emit('close-panel', []); save()" v-model="checkBox" :value="item.value">

关于javascript - 按 Enter 键将事件附加到 “v-btn”,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59042736/

相关文章:

vue.js - v-switch vuetify 按钮上的图标

javascript - VueJS 中的 v-html 不起作用(空页面)

vue.js - 是否可以调整 vuetify 组件的大小?

vue.js - 彩色应用栏出来完全是白色的 Vuetify

javascript - 计算多个元素宽度并在 document.ready 上减去它们

javascript - React 组件中的两个提供者

typescript - Vue 组件和 TypeScript 的状态问题

typescript - Vue/Typescript/Jest - Jest 单元测试语法错误 : Unexpected token import

javascript - electron App中如何获取appId

javascript - Backbone 模型默认值 - todos.js 示例中不必要的代码?