我的 "alret()" 函数在 vuejs 中不起作用

My "alret()" function is not working in vuejs

我是 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>

谁能告诉我解决办法并说明原因

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

而是使用 vuejs

v-on:click="addTask"

@click="addTask"