Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Input 输入框] IOS自动填充密码,无法获取用户名/密码的值 #3209

Open
myifeng opened this issue Oct 21, 2024 · 13 comments
Open
Labels
question This is a question, not a bug

Comments

@myifeng
Copy link

myifeng commented Oct 21, 2024

tdesign-miniprogram 版本

1.6.2

重现链接

No response

重现步骤

No response

期望结果

No response

实际结果

No response

基础库版本

No response

补充说明

No response

Copy link
Contributor

👋 @myifeng,感谢给 TDesign 提出了 issue。
请根据 issue 模版确保背景信息的完善,我们将调查并尽快回复你。

@anlyyao
Copy link
Collaborator

anlyyao commented Oct 22, 2024

@myifeng 辛苦贴一下你的使用代码、真机测试机型等信息

我这边在13pro上预览了一下,可以获取密码,代码如下:

<t-input label="标签文字" value="{{tdValue}}" placeholder="请输入文字" type="password" bind:change="tdInput"></t-input>

// js
tdInput(e) {
  this.setData({
    tdValue: e.detail.value,
  });
  console.log('--tdInput--', e.detail.value);
},

@anlyyao anlyyao added the question This is a question, not a bug label Oct 22, 2024
@myifeng
Copy link
Author

myifeng commented Oct 22, 2024

<t-input label="用户名" value="{{tdValue}}" placeholder="请输入文字" bind:change="tdInputUsername"></t-input>

<t-input label="密码" value="{{tdValue}}" placeholder="请输入文字" always-embed="{{true}}" type="password" bind:change="tdInputPassword" bindfocus="tdInputPassword" 	bindblur="tdInputPassword"></t-input>

<t-button class="login-btn" bindtap="login" theme="primary" size="large">登录</t-button>
tdInputUsername(e) {
  this.setData({
	  username: e.detail.value,
  });
  console.log(e)
  console.log('--username--', e.detail.value);
},
tdInputPassword(e) {
  this.setData({
	  password: e.detail.value,
  });
  console.log(e)
  console.log('--password--', e.detail.value);
},

点击密码输入框,选择IOS中的密码,表单会在用户名填充用户名,密码中填充......, 控制台会打印tdInputPassword的focus、blur日志,但是并没有获取到密码值。此时AppData中的password为undefined

在上一步操作后,手动点击密码输入框,使失焦和聚焦,此时才获取密码。 此时AppData中的password有值

但是因为用户名没有设置bindblur bindfocus,此时虽然用户名在UI上进行了填充,但是并没有获取到用户名的值。此时AppData中的username为undefined。

176692c7ccc195eba8012facc7434e1d.mp4

@myifeng
Copy link
Author

myifeng commented Oct 22, 2024

这里录屏密码显示空白,实际上是有填充黑色圆点的

<t-input label="用户名" value="{{tdValue}}" placeholder="请输入文字" bind:change="tdInputUsername"></t-input>

<t-input label="密码" value="{{tdValue}}" placeholder="请输入文字" always-embed="{{true}}" type="password" bind:change="tdInputPassword" bindfocus="tdInputPassword" 	bindblur="tdInputPassword"></t-input>

<t-button class="login-btn" bindtap="login" theme="primary" size="large">登录</t-button>
tdInputUsername(e) {
  this.setData({
	  username: e.detail.value,
  });
  console.log(e)
  console.log('--username--', e.detail.value);
},
tdInputPassword(e) {
  this.setData({
	  password: e.detail.value,
  });
  console.log(e)
  console.log('--password--', e.detail.value);
},

点击密码输入框,选择IOS中的密码,表单会在用户名填充用户名,密码中填充......, 控制台会打印tdInputPassword的focus、blur日志,但是并没有获取到密码值。此时AppData中的password为undefined

在上一步操作后,手动点击密码输入框,使失焦和聚焦,此时才获取密码。 此时AppData中的password有值

但是因为用户名没有设置bindblur bindfocus,此时虽然用户名在UI上进行了填充,但是并没有获取到用户名的值。此时AppData中的username为undefined。

176692c7ccc195eba8012facc7434e1d.mp4

这里录屏密码显示空白,实际上是有填充黑色圆点的

@anlyyao
Copy link
Collaborator

anlyyao commented Oct 22, 2024

@myifeng 你测试下这个代码片段:https://developers.weixin.qq.com/s/WIywo8mZ7nVs

我这边的效果和原生一致,

@LawyerLu
Copy link

LawyerLu commented Oct 22, 2024

我也存在同样的问题,用原生的input就正常,但是用t-input组件就无法自动填充。增加always-embed="{{true}}"后,可以自动填充,输入框内虽然填充了账号密码,但是并没有被value获取到,依然识别未填写。点击自动填充后,输入框会自动失去焦点,会不会是这个原因。真机预览机型:iPhone14pro

@anlyyao
Copy link
Collaborator

anlyyao commented Oct 23, 2024

@myifeng 你测试下这个代码片段:https://developers.weixin.qq.com/s/WIywo8mZ7nVs

我这边的效果和原生一致,

@myifeng 和 always-embed 莫关系,但尊的太奇怪了,我的机型是13pro,ios版本17.6.1,测试下来和原生input一致,如果方便的话,可以测试一下这个代码片段吗

@yaytgif
Copy link

yaytgif commented Oct 23, 2024

iOS平台原生也有概率出现, 小程序那边也有反馈这个问题的存在

@lihua0103
Copy link

你用ios设备,切换到中文,输入密码,不点击确认,密码框有圆点,但是获取不到值,哈哈哈

@anlyyao
Copy link
Collaborator

anlyyao commented Oct 24, 2024

你用ios设备,切换到中文,输入密码,不点击确认,密码框有圆点,但是获取不到值,哈哈哈

密码框能支持中文输入? 🤯

@lihua0103
Copy link

你可以自己切换输入法呀

@anlyyao
Copy link
Collaborator

anlyyao commented Oct 25, 2024

你可以自己切换输入法呀

我这边的情况是:真机上,密码输入框,输入法会被强制切换为英文模式,无法切换。

@myifeng
Copy link
Author

myifeng commented Oct 25, 2024

你可以自己切换输入法呀

我这边的情况是:真机上,密码输入框,输入法会被强制切换为英文模式,无法切换。

我试了一下,只有一个密码输入框是可以获取到值的,但是如果同时存在用户名、密码的输入框,就只有UI填空,change事件没有触发

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
question This is a question, not a bug
Projects
None yet
Development

No branches or pull requests

5 participants