javascript - VueJS - 元素 UI 输入组件 - 事件处理程序“输入”错误

Question

我正在尝试使用 VueJS 和 Element-UI 创建一个自定义组件，并且在尝试将数据输入到输入字段时遇到了一个非常烦人的错误。

以下是与该问题相关的文件和内容：

components.js 文件：

Vue.component('yetti-input', {
    props: ['value'],
    template: '<el-input ref="input" v-bind:value="value" v-on:input="parseValue($event.target.value)"></el-input>',
    methods: {
        parseValue (value) {
            this.$emit('input', value)
        }
    }
})

index.vue 文件：

<template>
    <div>
        <div class="login-form">
            <yetti-form>
                <yetti-input v-model="login.email"></yetti-input>
            </yetti-form>
        </div>
    </div>
</template>

<script>
    export default {
        data () {
            return {
                login: {
                    email: '',
                    password: ''
                }
            }
        }
    }
</script>

我在控制台中收到的错误：

请指出我是否是个傻瓜，但是我一生都无法弄清楚发生了什么。

干杯，蒂姆

Answer 1

好的，我解决了我的问题。

有趣的是，$event 是使用 el-input 时提供的输入值。

而不是：v-on:input="parseValue($event.target.value)"

我删除了 target.value，我有了我的价值。 v-on:input="parseValue($event)"

不确定我是否在这里做错了 VueJS。但是，这已经解决了我的问题。