Nuxt.js: <input type = "search"> не работает

Question

Если вы пишете <input type="search"> в HTML5, клавиатура ввода в Safari на iOS выглядит следующим образом.

Submitкнопка "поиск".

Кстати, я пытаюсь создать форму поиска и в Nuxt.js и пометить ее в компоненте, как показано ниже.

<div class="search-form">
  <form
    @submit.prevent
    @keyup="onKey($event)">
    <input
      v-model="keyword"
      :placeholder="search form"
      type="search"
      @keypress="setCanMessageSubmit($event)">
  </form>
</div>

Однако клавиатура показывает «возврат» вместо «поиск», как показано ниже.

Почему это так?
Есть ли способ решить эту проблему

Answer 1

Попробуйте добавить атрибут action к тегу form.

<div class="search-form">
  <form
    action="."
    @submit.prevent
    @keyup="onKey($event)">
    <input
      v-model="keyword"
      :placeholder="search form"
      type="search"
      @keypress="setCanMessageSubmit($event)">
  </form>
</div>

Моя скрипка: https://jsfiddle.net/pompopo/2b0yc6oq/7/