VueJS - 元素 UI 输入组件 - 事件处理程序 "input" 错误

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 做错了。但是，这已经解决了我的问题。

VueJS - 元素 UI 输入组件 - 事件处理程序 "input" 错误

VueJS - Element UI Input Component - Event handler "input" error

javascript

vue.js

element-ui