<template>
<view class="content">
<text>密码：</text>
<u--input
ref="passwordRef"
v-model="password"
placeholder="请输入密码"
clearable
:type="type"
border="bottom"
>
<template slot="suffix">
<u-icon name="eye" size="40" v-if="isPassword" @click="changeShowPwd" />
<u-icon name="eye-fill" size="40" v-if="!isPassword" @click="changeShowPwd" />
</template>
</u--input>
</view>
</template>
<script>
export default {
data() {
return {
password: '' ,// 密码
isPassword: true, //密码是否显示
type:"password"
}
},
mounted() {},
methods: {
changeShowPwd() {
this.isPassword = !this.isPassword
if(this.isPassword){
this.type="text"
}else{
this.type="password"
}
console.log(this.type,'type')
}
}
}
</script>
<style lang="scss" scoped>
// ROOT
.login-root-view {
flex: 1;
.content {
flex: 1;
flex-direction: row;
padding: 0 50rpx 0 40rpx;
}
}
</style>
pure111
- 发布：2022-04-14 16:49
- 更新：2022-04-15 11:25
- 阅读：1065
产品分类： uniapp/App
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： Windows 10 1909
手机系统： Android
手机系统版本号： Android 8.0
手机厂商： 模拟器
手机机型： HUAWE OXF-AN00
页面类型： vue
vue版本： vue2
打包方式： 云端
项目创建方式： CLI
CLI版本号： 2
示例代码：
操作步骤：
APP-NVUE端中使用u--input组件动态切换type类型出现以下问题
①切换类型后，本身input是有数据的，但是光标并未到数据后面，而是在数据前面，不符合用户使用逻辑
APP-NVUE端中使用u--input组件动态切换type类型出现以下问题
①切换类型后，本身input是有数据的，但是光标并未到数据后面，而是在数据前面，不符合用户使用逻辑
预期结果：
切换类型后，本身input是有数据的，光标在数据后面
切换类型后，本身input是有数据的，光标在数据后面
实际结果：
切换类型后，本身input是有数据的，光标在数据前面
切换类型后，本身input是有数据的，光标在数据前面
bug描述：
APP-NVUE端中使用u--input组件动态切换type类型出现以下问题
①切换类型后，本身input是有数据的，但是光标并未到数据后面，而是在数据前面，不符合用户使用逻辑
FullStack - 【插件开发】【专治疑难杂症】【ios上架、马甲包、白包、过审、已成功上架过几百个】【多款插件已上架：https://ext.dcloud.net.cn/publisher?id=22130】【非诚勿扰】QQ：543610866
上传完整的可以复现的demo，方便排查，u--input哪里来的
pure111 (作者)
···
①附件文件是示例文件（整个项目），下载的是uniapp官方的示例文件
②demo在文件的路径 pages/tabBar/component/component （用自定义基座，安卓模拟器打开后是首页）
③ u--input来源是 uView 这个UI框架
···
