Vue implements a change in the lower right corner of the mobile phone soft keyboard into a search and search button

1. There is a problem

Entering iOS type=”search” adds a mobile phone soft keyboard to the lower right corner of the mobile phone as follows

2. Method of treatment

<form action="" @submit.prevent="onSearch">
  <input 
	type="search" 
  	:placeholder="Пожалуйста, введите поиск по ключевым словам" 
	v-model="value" />
</form>

. Premodified: Prevent form submission by default.
Click Submit is the default behavior for submitting the form. It does not need to be sent here. It should only implement the find method, so it’s best to block it.
The entry type must be a search type. The mobile keyboard will display a search button under this type
iOS compatibility issue: It needs to be added to the form in order to wrap the input

Three effect scheme

Leave a Comment