✨ feat(输入框组件): 优化处理输入框弹出遮挡问题

@@ -72,7 +72,8 @@
         </div>
         <div>
           <van-field v-model="message" rows="2" autosize label="" type="textarea" maxlength="200"
-            placeholder="请填写您对小朋友的温馨鼓励" show-word-limit />
+            placeholder="请填写您对小朋友的温馨鼓励" show-word-limit @focus="focusInput"
+          @blur="blurInput" />
         </div>
         <div style="margin-top: 3rem;">
           <my-button type="primary" @on-click="handleAudit('disable')">确定</my-button>
@@ -173,6 +174,28 @@ const handleAudit = (status) => {
     console.error(err); 
   })
 }
+
+// 优化处理输入框弹出遮挡问题
+let interval = ''
+const focusInput = () => {
+  window.addEventListener("resize", function () {
+    if (
+      document.activeElement.tagName === "INPUT" ||
+      document.activeElement.tagName === "TEXTAREA"
+    ) {
+      interval = window.setTimeout(function () {
+        if ("scrollIntoView" in document.activeElement) {
+          document.activeElement.scrollIntoView();
+        } else {
+          document.activeElement.scrollIntoViewIfNeeded();
+        }
+      }, 0);
+    }
+  });
+}
+const blurInput = () => {
+  clearInterval(interval);
+}
 </script>
 
 <script>

 <template>
-  <van-popup
-    v-model:show="show"
-    :close-on-click-overlay="false"
-    position="bottom"
-    :style="{ height: '40%' }"
-  >
+  <van-popup v-model:show="show" :close-on-click-overlay="false" position="bottom" :style="{ height: '40%' }">
     <div class="van-hairline--bottom">
       <van-row>
         <van-col span="4" />
@@ -33,16 +28,9 @@
     </div>
     <div>
       <van-cell-group inset>
-        <van-field
-          v-model="message"
-          rows="2"
-          autosize
-          label=""
-          type="textarea"
-          maxlength="200"
-          :placeholder="type === 'comment' ? '请输入留言内容' : '请输入回复内容'"
-          show-word-limit
-        />
+        <van-field v-model="message" rows="2" autosize label="" type="textarea" maxlength="200"
+          :placeholder="type === 'comment' ? '请输入留言内容' : '请输入回复内容'" show-word-limit @focus="focusInput"
+          @blur="blurInput" />
       </van-cell-group>
     </div>
   </van-popup>
@@ -84,20 +72,27 @@ const submitComment = () => {
 watch(() => props.showPopup, (v) => {
   show.value = v
 })
-</script>
 
-<script>
-export default {
-  data () {
-    return {
+// 优化处理输入框弹出遮挡问题
+let interval = ''
+const focusInput = () => {
+  window.addEventListener("resize", function () {
+    if (
+      document.activeElement.tagName === "INPUT" ||
+      document.activeElement.tagName === "TEXTAREA"
+    ) {
+      interval = window.setTimeout(function () {
+        if ("scrollIntoView" in document.activeElement) {
+          document.activeElement.scrollIntoView();
+        } else {
+          document.activeElement.scrollIntoViewIfNeeded();
         }
-  },
-  mounted () {
-  },
-  watch: {
-  },
-  methods: {
+      }, 0);
     }
+  });
+}
+const blurInput = () => {
+  clearInterval(interval);
 }
 </script>