输入框增添隐藏图表

pages/start/recoverPassword/recoverPassword.vue

@@ -60,6 +60,16 @@
             placeholder="输入新密码"
             v-model="newPassword"
           />
+          <image
+            class="input-icon-eye"
+            @click="newPasswordLookFirst=!newPasswordLookFirst"
+            :src="
+              newPasswordLookFirst
+                ? '../../../static/icons/unlook.png'
+                : '../../../static/icons/look.png'
+            "
+            alt=""
+          />
         </view>
         <view class="input-with-icon">
           <image
@@ -73,6 +83,16 @@
             placeholder="再次确认"
             v-model="password"
           />
+          <image
+            class="input-icon-eye"
+            @click="newPasswordLookSecond=!newPasswordLookSecond"
+            :src="
+              newPasswordLookSecond
+                ? '../../../static/icons/unlook.png'
+                : '../../../static/icons/look.png'
+            "
+            alt=""
+          />
         </view>
       </view>
     </view>
@@ -226,6 +246,8 @@ const codeBtnText = ref("获取验证码");
 const isCodeBtnDisabled = ref(false); // 添加验证码按钮禁用状态
 const checkboxUrl = ref("../../../static/icons/Check-one-false.png");
 const isRecovering = ref(false);
+const newPasswordLookFirst = ref(false);
+const newPasswordLookSecond = ref(false);
 
 // 使用从list.js导入的完整国家列表数据
 const countries = ref(
@@ -553,6 +575,7 @@ function handleAgree() {
   checkboxUrl.value = "../../../static/icons/Check-one-true.png";
   // 继续登录流程
 }
+
 </script>
 
 <style scoped>
@@ -688,6 +711,11 @@ function handleAgree() {
   height: 40rpx;
   margin: 0 20rpx;
 }
+.input-icon-eye {
+  width: 40rpx;
+  height: 20rpx;
+  margin: 0 20rpx;
+}
 
 .input-field {
   flex: 1;