[字节跳动] AtInput 无法连续输入

[hao-li]

问题描述 使用官网文档的代码，在 AtInput 输入一个字符后，该组件就自动失去焦点，无法连续输入。

iOS 真机上还会出现键盘消失，输入的字符消失的现象。

复现步骤

1. git clone [email protected]:hao-li/taro-problem-sample.git
2. yarn
3. yarn build:tt（yarn dev:tt）
4. 点击进入字节跳动小程序问题页
5. 在『标准5个字』处的 AtInput 进行输入

  handleInputChange (value) {
    this.setState({
      inputValue: value
    })
    // 在小程序中，如果想改变 value 的值，需要 `return value` 从而改变输入框的当前值
    return value
  }
        <AtInput
          name='value'
          title='标准五个字'
          type='text'
          placeholder='标准五个字'
          value={this.state.inputValue}
          onChange={this.handleInputChange.bind(this)}
        />

期望行为 期望能连续完成输入

报错信息 该组件就自动失去焦点，无法连续输入。 iOS 真机上还会出现键盘消失，输入的字符消失的现象。

系统信息

👽 Taro v1.3.35


  Taro CLI 1.3.35 environment info:
    System:
      OS: macOS 10.15.2
      Shell: 5.7.1 - /bin/zsh
    Binaries:
      Node: 11.10.0 - /usr/local/bin/node
      Yarn: 1.17.3 - /usr/local/bin/yarn
      npm: 6.13.4 - /usr/local/bin/npm
    npmPackages:
      @tarojs/components: 1.3.35 => 1.3.35
      @tarojs/plugin-babel: 1.3.35 => 1.3.35
      @tarojs/plugin-csso: 1.3.35 => 1.3.35
      @tarojs/plugin-sass: 1.3.35 => 1.3.35
      @tarojs/plugin-uglifyjs: 1.3.35 => 1.3.35
      @tarojs/router: 1.3.35 => 1.3.35
      @tarojs/taro: 1.3.35 => 1.3.35
      @tarojs/taro-alipay: 1.3.35 => 1.3.35
      @tarojs/taro-h5: 1.3.35 => 1.3.35
      @tarojs/taro-swan: 1.3.35 => 1.3.35
      @tarojs/taro-tt: 1.3.35 => 1.3.35
      @tarojs/taro-weapp: 1.3.35 => 1.3.35
      @tarojs/webpack-runner: 1.3.35 => 1.3.35
      eslint-config-taro: 1.3.35 => 1.3.35
      eslint-plugin-taro: 1.3.35 => 1.3.35
      nerv-devtools: ^1.5.6 => 1.5.6
      nervjs: ^1.5.6 => 1.5.6
      stylelint-config-taro-rn: 1.3.35 => 1.3.35
      stylelint-taro-rn: 1.3.35 => 1.3.35

• Taro 版本: 1.3.35
• Taro UI 版本: 2.2.4
• 报错平台: tt

补充信息 v2.2.1 版本也存在此问题

[taro-ui-bot[bot]]

欢迎提交 Issue~

如果你提交的是 bug 报告，请务必遵循 Issue 模板的规范，尽量用简洁的语言描述你的问题，最好能提供一个稳定简单的复现。🙏🙏🙏

如果你的信息提供过于模糊或不足，或者已经其他 issue 已经存在相关内容，你的 issue 有可能会被关闭。

Good luck and happy coding~

[jonsen-liu]

楼主解决了吗？我也遇见这种问题

[hao-li]

@jonsen-liu 没解决

[Garfield550]

先用 Taro 的 Input 试试看？

[jonsen-liu]

我现在是用的原生组件，没用Taro-UI的input

[Garfield550]

@jonsen-liu 可以测试一下 Taro 的 Input 组件正不正常吗？AtInput 也只是给 Taro 的 Input 封装了一些 View，加了样式。

import { Input } from '@tarojs/components'

[jonsen-liu]

@aNd1coder Taro的Input 不就是原生组件么？-_-!

[Garfield550]

抱歉，理解有误，我认为你换了字节跳动小程序原生开发。那么 Taro 的 Input 是正常的对吗？

[jonsen-liu]

@aNd1coder 目前测试 h5 微信 字节跳动 都行

[Garfield550]

Taro 的版本是 1.3 还是 2.0？ Taro UI 的版本是 2.2.4 及以下吗？

[mrTangYun]

Taro 的版本是 2.0.7 Taro UI 的版本是 2.3.1 编译成tt，用抖音测试，真机ios 目前仍然存在这个问题，

[codlin]

"taro-ui": "^3.0.0-alpha.3" 也出现了这个问题，请问怎么解决的，用Taro的Input？

[chieway]

"taro-ui": "^3.0.0-alpha.3"，@tarojs/taro": "3.0.11"，我也遇到这个问题，我看时间都过去了挺久了

[codlin]

"taro-ui": "^3.0.0-alpha.3"，@tarojs/taro": "3.0.11"，我也遇到这个问题，我看时间都过去了挺久了

用原生组件了

[maroon1]

目前的 workaround 是显式的为组件设置 focus 属性，例如<AtInput focus />

[GWesley]

2020都快结束，还没人解决么？

[HeyShinner]

我也遇到了这个问题，用 Taro 的 Input 暂时解决了

[Ming-z-y]

AtInput里面加上focus属性好像就可以了

[cat-kun]

这个bug 2023年还没解决吗

[jonsen-liu]

这个bug 2023年还没解决吗

卧槽，还有这问题？最新的UI么？我中途换uniapp了，没搞Taro了

[cat-kun]

这个bug 2023年还没解决吗

卧槽，还有这问题？最新的UI么？我中途换uniapp了，没搞Taro了

"taro-ui": "3.1.0-beta.4"

[1ihu]

const ListItem = () => { return <Input></Input> },我也碰到这个问题了 ，但是我把组件写成 {ListItem()} 这样就可以。 写成<ListItem> 就失去焦点

[1ihu]

[robinv8]

在 3.1.0 版本已解决