Javascript Vue.js提交文本按钮

我有个问题

我有一个带有文本字段的表单。如果我键入一些内容，然后按enter键，则没有结果。如果我输入一些东西，然后按下按钮，我就会得到我想要的结果。有人能帮我解决这个问题吗？这是用vue.js编写的

    <div class ="well">
    <form class="form-inline" onsubmit="searchName">
    <h1><label>Enter Search</label></h1>
    <input type="text" name="name" class="form-control" v-model="search">    
    </form>
    </div>
    <input id="clickMe" type="button" value="clickme" v-on:click="searchName" />

输入搜索

将您的按钮放在

标签内，并将按钮类型更改为

提交

：

<div class ="well">
    <form class="form-inline" @submit.prevent="searchName">
        <h1><label>Enter Search</label></h1>
        <input type="text" name="name" class="form-control" v-model="search">   
        <input id="clickMe" type="submit" value="clickme"/> 
    </form>
</div>

输入搜索

编辑

---

使用

@submit代替按钮中的
onclick
事件。在表单中防止
。
将您的按钮放在
标记内，并将按钮类型更改为
submit
：

<div class ="well">
    <form class="form-inline" @submit.prevent="searchName">
        <h1><label>Enter Search</label></h1>
        <input type="text" name="name" class="form-control" v-model="search">   
        <input id="clickMe" type="submit" value="clickme"/> 
    </form>
</div>


输入搜索

编辑

在表单中使用
@submit.prevent
，而不是单击按钮中的
事件。
您可以在文本字段中添加事件

<input 
type="text" 
name="name" 
class="form-control" 
v-model="search"
v-on:keyup.enter="searchName" 
/>



或者在表单中添加提交事件

<form 
class="form-inline" 
v-on:submit.prevent="searchName"
>

您可以在文本字段中添加事件

<input 
type="text" 
name="name" 
class="form-control" 
v-model="search"
v-on:keyup.enter="searchName" 
/>



或者在表单中添加提交事件

<form 
class="form-inline" 
v-on:submit.prevent="searchName"
>


这两种解决方案都有效，只是第二种似乎更适合我-感谢您的贡献！这两种解决方案都奏效了，只是第二种似乎更适合我——感谢所有的贡献！