input的type設(shè)為search,外面再套一層form,加上@submit.prevent防止提交,submit會(huì)在action之前執(zhí)行,還要加上action="javascript:return true;"
只有action="javascript:return;會(huì)報(bào)錯(cuò)Uncaught SyntaxError: Illegal return statement(非法返回語(yǔ)句);
只有@submit.prevent;問題是ios在輸入中文,鍵入字母按了空格后,搜索就變成確認(rèn)了,無法觸發(fā)搜索事件;
<form
action="javascript:return true;"
@submit.prevent
>
<input
ref="searchInput"
v-model="keyword"
type="search"
placeholder="請(qǐng)輸入關(guān)鍵字"
@keyup.13="search()"
>
</form>
監(jiān)聽搜索事件用@keyup.13
后發(fā)現(xiàn)問題:ios點(diǎn)了搜索之后,鍵盤不自動(dòng)收回
故加上ref手動(dòng)blur
methods: {
async search(categoryId) {
this.$refs.searchInput.blur();
}
}