fix 更新换行切换功能

 <!--
  * @Date: 2023-08-22 14:13:07
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2023-08-25 15:15:29
+ * @LastEditTime: 2023-08-25 17:07:08
  * @FilePath: /bieyuan/src/views/next.vue
  * @Description: 文件描述
 -->
@@ -10,10 +10,10 @@
     <van-form @submit="onSubmit">
       <div v-for="(item, index) in userInfo" :key="index" class="input-box">
         <p class="title">{{ index + 1 }}.{{ index === 0 ? '我的信息' : '同行人' }}</p>
-        <van-field v-model="item.name" label="姓名:" type="text" placeholder="请输入姓名" :border="false"
-          :rules="[{ required: true, message: '请填写姓名' }]" label-width="4em" class="input-text" />
-        <van-field v-model="item.phone" label="手机号:" type="digit" placeholder="请输入手机号" :border="false"
-          :rules="[{ validator: validatorPhone, message: '请输入正确手机号' }]" label-width="4em" class="input-text" />
+        <van-field :id="'name' + index" v-model="item.name" label="姓名:" type="text" placeholder="请输入姓名" :border="false"
+          :rules="[{ required: true, message: '请填写姓名' }]" label-width="4em" class="input-text" @focus="onFocus"  @keydown="handleKeyDown" />
+        <van-field :id="'phone' + index" v-model="item.phone" label="手机号:" type="digit" placeholder="请输入手机号" :border="false"
+          :rules="[{ validator: validatorPhone, message: '请输入正确手机号' }]" label-width="4em" class="input-text"  @focus="onFocus"  @keydown="handleKeyDown" />
         <van-field label="证件类型:" :border="false" label-width="4.5em">
           <template #input>
             <van-radio-group v-model="item.id_type" direction="horizontal" checked-color="#93663D" style="height: 2.5rem;">
@@ -22,10 +22,10 @@
             </van-radio-group>
           </template>
         </van-field>
-        <van-field v-if="item.id_type === 'id_card'" v-model="item.id_number" label="身份证:" type="text" placeholder="请输入身份证号" :border="false"
-          :rules="[{ validator: validatorId, message: '请填写正确身份证号' }]" label-width="4em" class="input-text" />
-        <van-field v-else v-model="item.id_number" label="护照:" type="text" placeholder="请输入护照号" :border="false"
-            :rules="[{ required: true, message: '请填写正确护照号' }]" label-width="4em" class="input-text" />
+        <van-field :id="'id_type' + index" v-if="item.id_type === 'id_card'" v-model="item.id_number" label="身份证:" type="text" placeholder="请输入身份证号" :border="false"
+          :rules="[{ validator: validatorId, message: '请填写正确身份证号' }]" label-width="4em" class="input-text"  @focus="onFocus"  @keydown="handleKeyDown" />
+        <van-field :id="'id_type' + index" v-else v-model="item.id_number" label="护照:" type="text" placeholder="请输入护照号" :border="false"
+            :rules="[{ required: true, message: '请填写正确护照号' }]" label-width="4em" class="input-text"  @focus="onFocus"  @keydown="handleKeyDown" />
       </div>
       <div style="padding: 2rem;">
         <van-button block type="primary" color="#93663D" native-type="submit">
@@ -61,6 +61,7 @@ const { appUserInfo } = storeToRefs(store);
 
 const userInfo = ref([]); // 用户预约信息
 const num = ref(1);
+const keyDownList = ref([])
 
 onMounted(async () => {
   num.value = $route.query.count ? +$route.query.count : 1;
@@ -96,7 +97,32 @@ onMounted(async () => {
       userInfo.value[0] = data;
     }
   }
-})
+  //
+  for (let index = 0; index < userInfo.value.length; index++) {
+    // const element = keyDownList[index];
+    const arr = ['name', 'phone', 'id_type']
+    for (let idx = 0; idx < arr.length; idx++) {
+      const element = arr[idx] + index;
+      keyDownList.value.push(element)
+    }
+  }
+});
+
+// 点击换行功能
+const currentIndex = ref('');
+const onFocus = (evt) => {
+  const currentId = $(evt.target).attr('id');
+  currentIndex.value = keyDownList.value.indexOf(currentId);
+}
+const handleKeyDown = (evt) => {
+  //
+  if (evt.keyCode === 13) {
+    const id = `input#${keyDownList.value[currentIndex.value + 1]}`;
+    if (id) {
+      $(id).focus()
+    }
+  }
+}
 
 /**
  * 手机号码校验