<template>
<view class="wrap">
<view class="login">
<view class="login-title">用户登录</view>
<view class="login-item _user">
<input class="login-input" placeholder-class="login-inputg" v-model="oLoginForm.loginname"
placeholder="请输入用户名" />
</view>
<view class="login-item _pas">
<input class="login-input" placeholder-class="login-inputg" type="password"
v-model="oLoginForm.password" placeholder="请输入密码" />
</view>
<view class="login-flex">
<view @tap="fGoPage(2)">注册账号</view>
<view @tap="fGoPage(1)">帮助文档</view>
</view>
<view class="login-btn btn _green" @tap="fLogin">登录</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
oLoginForm: { //登录信息
loginname: '',
password: ''
}
}
},
methods: {
// 登录
fLogin() {
if (!this.oLoginForm.loginname.trim()) {
this.G_API.ufShowMsg('用户名不能为空');
return false;
}
if (!this.oLoginForm.password.trim()) {
this.G_API.ufShowMsg('密码不能为空')
return false;
}
},
/**
* 跳转页面
* @param {Number} nType 类型 1
*/
fGoPage(nType) {
switch (nType) {
case 1:
break;
case 2:
break;
default:
break;
}
}
}
}
</script>
<style lang="less" scoped>
.wrap {
background: #FFFFFF url('~@/static/image/login/background.png') no-repeat top center / 100%;
}
.login {
margin: 520rpx 30rpx 0;
padding: 0 48rpx;
box-sizing: border-box;
background: #FFFFFF;
border-radius: 14rpx;
box-shadow: 0rpx 5rpx 10rpx rgba(92, 93, 97, 0.24);
}
.login-title {
margin: 35rpx auto 59rpx;
text-align: center;
font-size: 50rpx;
color: #0D9A94;
}
.login-item {
position: relative;
margin-bottom: 46rpx;
padding-left: 77rpx;
height: 93rpx;
box-sizing: border-box;
border-bottom: 1rpx solid #C8DBD8;
&::before {
position: absolute;
left: 0;
top: 0;
display: block;
width: 53rpx;
height: 53rpx;
border-radius: 13rpx;
box-shadow: 0rpx 3rpx 6rpx rgba(117, 191, 191, 0.3);
background: no-repeat center / auto 32rpx;
content: '';
}
&._user::before {
background-image: url('~@/static/image/login/username.png');
}
&._pas::before {
background-image: url('~@/static/image/login/password.png');
}
}
.login-input {
font-size: 14px;
height: 53rpx;
line-height: 53rpx;
}
.login-inputg {
color: #B5B5B5;
}
.login-flex {
display: flex;
justify-content: space-between;
font-size: 12px;
color: #333333;
}
.login-btn {
width: auto;
height: 88rpx;
margin: 117rpx 0 87rpx;
letter-spacing: 6rpx;
}
</style>
- 发布:2023-08-30 16:49
- 更新:2023-10-12 16:28
- 阅读:254
【报Bug】Redmi K40 Android 13 系统 点击input 弹起键盘时 有概率页面推上去,漏出下层页面的内容(softinputMode为默认值adjustPan)
产品分类: uniapp/App
PC开发环境操作系统: Windows
PC开发环境操作系统版本号: windows 10
HBuilderX类型: 正式
HBuilderX版本号: 3.8.12
手机系统: Android
手机系统版本号: Android 13
手机厂商: 小米
手机机型: Redmi K40
页面类型: vue
vue版本: vue2
打包方式: 云端
项目创建方式: HBuilderX
示例代码:
操作步骤:
点击用户名 再点击密码
点击用户名 再点击密码
预期结果:
正常弹出键盘
正常弹出键盘
实际结果:
有概率出现页面推上去,漏出下层页面的内容(概率还比较高的)
有概率出现页面推上去,漏出下层页面的内容(概率还比较高的)
bug描述:
Redmi K40 Android 13 系统 点击input 弹起键盘时 有概率页面推上去,漏出下层页面的内容(softinputMode为默认值adjustPan)