Vue中表单提交函数未向控制台输出对象的问题求助

• 核心错误：Vue组件中定义方法的选项是**methods**（复数形式），你代码里写成了method（单数），导致onSubmit方法未被正确注册，点击提交按钮时不会触发该函数，因此控制台没有输出。

修正后的<script>部分代码：

<script>
export default{
    name: 'AddTask',
    data() {
        return {
            text: '',
            day: '',
            reminder: false,
        }
    },
    // 修正为复数形式methods
    methods: {
        onSubmit(e){
            // form标签已通过@submit.prevent阻止默认行为，此处可省略e.preventDefault()
            if (!this.text) {
                alert('Please add a task')
                return
            }

            const newTask = {
                id: Math.floor(Math.random() * 100000),
                text: this.text,
                day: this.day,
                reminder: this.reminder,
            }

            console.log(newTask)
            //this.$emit('add-task', newTask)

            this.text = ''
            this.day = ''
            this.reminder = false
        }
    }
}
</script>

额外说明：form标签上的@submit.prevent已经完成了阻止表单默认提交的操作，所以onSubmit函数内的e.preventDefault()可以移除，不过这不是导致当前问题的原因。

内容的提问来源于stack exchange，提问作者Chizo