在Vue中定义的方法为什么会'ReferenceError: searchKey is not defined'?

Question

问题:Vue中定义的方法不起效,下面是我的代码
HTML:

<div class="mallSearch-input clearfix">
    <div class="s-combobox" id="s-combobox-685">
        <div class="s-combobox-input-wrap">
            <input v-model="keyword" type="text" autocomplete="off" value="dd" id="mq"
                   class="s-combobox-input" aria-haspopup="true">
        </div>
    </div>
    <button type="submit" @click.prevent="searchKey" id="searchbtn">搜索</button>
</div>

JS:

<script th:src="@{/js/vue.min.js}"></script>
<script th:src="@{/js/axios.min.js}"></script>
<script>

    new Vue({
        el: '#app',
        data: {
            keyword: '', //关键字
            results: [] //搜索的结果
        },
        method: {
            searchKey: function() {
                let keyword = this.keyword;
                console.log(keyword);
                //对接后端的接口
                axios.get('search/' + keyword + "/1/10").then(response =>{
                    console.log(response);
                })
            }
        }
    })
</script>

在我点击button后,控制台报出了'ReferenceError: searchKey is not defined'
提示我的searchKey方法没有定义,求大家看看哪里的问题
我试过searchKey: function(){}, searchKey(){}两种方式定义方法

Answer 1

methods

Answer 2

把method换成methods试试？

Answer 3

methods