javascript - 我的“alret()”函数在 vuejs 中不起作用

Question

我是 vue 的初学者，并尝试在单击按钮时执行警报功能，但我得到的错误是Uncaught ReferenceError: addTask is not defined

这是我的代码：-

<template>
    
    <div class="col-md-8 mt-4">
        <div class="card card-default">
            <div class="card-header">
                Task Form
            </div>
            <div class="card-body">
                <form action="./api/task" method="POST" onClick="addTask">
                    
                    <div class="form-group">
                        <input type="text" name="title" placeholder="Task title" class="form-control">

                        
                    </div>
                    <input type="submt" value="Add Task" class="btn btn-info">
                </form>
                
            </div>
            
        </div>
        
    </div>
</template>

<script >
    
    export default {
        mounted() {
            console.log('component mounted.')
        },

        methods: {
            addTask(){
                alert('Adding The Task');
            }
        }
    }

</script>

谁能告诉我解决方案并解释原因。

Answer 1

onClick="addTask" 要使它工作，addTask需要是一个全局方法

相反，使用 vuejs

v-on:click="addTask"

或者

@click="addTask"