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

被ConfigProvider包裹后的组件内的Input框无法输入, 点击后直接失焦 #2196

Closed
ONE-0508 opened this issue Apr 23, 2024 · 7 comments
Assignees
Labels
Need Reproduce to be closed 未提供最小化可复现 demo 且长期无进展的 issue

Comments

@ONE-0508
Copy link

NutUI React 包名

@nutui/nutui-react-taro

NutUI React 版本号

2.6.1

平台

weapp

重现链接

重现步骤

组件被 ConfigProvider 包裹后,内有input框无法输入, 点击输入后会直接失焦

   <ConfigProvider theme={baseTheme}>
            <View className='login-ac content'>
                <Form
                  onFinish={onSubmit}
                  footer={
                    <Button
                      formType='submit'
                      type='primary'
                      block
                    >
                      登录
                    </Button>
                  }
                >
                  <Form.Item
                    label='用户名'
                    name='username'
                    rules={[
                      { max: 20, message: '用户名不能超过20个字符' },
                      { max: 4, message: '用户名必须大于4个字符' },
                      { required: true, message: '请输入用户名' },
                      {
                        pattern: /^[\w-]{4,20}$/,
                        message: '请输入英文或数字组成的用户名!'
                      }
                    ]}
                  >
                    <Input
                      placeholder='请输入用户名'
                      type='text'
                      onChange={(v) => {
                        console.log('onChange', v)
                      }}
                    />
                  </Form.Item>
                  <Form.Item
                    label='密码'
                    name='password'
                    rules={[
                      { required: true, message: '请输入密码' },
                      {
                        pattern: /^\S*(?=\S{6,})(?=\S*\d)(?=\S*[a-z])(?=\S*[!@#$%^&*? ])\S*$/,
                        message: '请输入英文或数字组成的密码'
                      }
                    ]}
                  >
                    <Input
                      placeholder='请输入密码'
                      type='password'
                    />
                  </Form.Item>
                </Form>
            </View>
    </ConfigProvider>

期望的结果是什么?

能正常输入 input

实际的结果是什么?

无法正常输入

环境信息

No response

其他补充信息

No response

@ONE-0508
Copy link
Author

Taro CLI 3.6.27 environment info:
System:
OS: macOS 13.5
Shell: 5.9 - /bin/zsh
Binaries:
Node: 18.19.1 - ~/.nvm/versions/node/v18.19.1/bin/node
Yarn: 1.22.22 - ~/.nvm/versions/node/v18.19.1/bin/yarn
npm: 10.2.4 - ~/.nvm/versions/node/v18.19.1/bin/npm
npmPackages:
@tarojs/cli: 3.6.26 => 3.6.26
@tarojs/components: 3.6.26 => 3.6.26
@tarojs/helper: 3.6.26 => 3.6.26
@tarojs/plugin-framework-react: 3.6.26 => 3.6.26
@tarojs/plugin-html: ^3.6.27 => 3.6.27
@tarojs/plugin-platform-alipay: 3.6.26 => 3.6.26
@tarojs/plugin-platform-h5: 3.6.26 => 3.6.26
@tarojs/plugin-platform-jd: 3.6.26 => 3.6.26
@tarojs/plugin-platform-qq: 3.6.26 => 3.6.26
@tarojs/plugin-platform-swan: 3.6.26 => 3.6.26
@tarojs/plugin-platform-tt: 3.6.26 => 3.6.26
@tarojs/plugin-platform-weapp: 3.6.26 => 3.6.26
@tarojs/react: 3.6.26 => 3.6.26
@tarojs/runtime: 3.6.26 => 3.6.26
@tarojs/shared: 3.6.26 => 3.6.26
@tarojs/taro: 3.6.26 => 3.6.26
@tarojs/taro-loader: 3.6.26 => 3.6.26
@tarojs/webpack5-runner: 3.6.26 => 3.6.26
babel-preset-taro: 3.6.26 => 3.6.26
eslint-config-taro: 3.6.26 => 3.6.26
react: ^18.0.0 => 18.2.0

Copy link

你好 @ONE-0508, 我们需要你提供一个在线的重现实例以便于我们帮你排查问题。你可以通过点击 此处 创建一个 codesandbox 或者提供一个最小化的 GitHub 仓库。请确保选择准确的版本。

@eiinu
Copy link
Member

eiinu commented Apr 25, 2024

首先 @tarojs/plugin-html 的版本应该与其他 Taro 包保持一致

@eiinu eiinu added the to be closed 未提供最小化可复现 demo 且长期无进展的 issue label May 10, 2024
@M0ql
Copy link

M0ql commented May 13, 2024

应该跟ConfigProvider没什么关系 我有的页面这样用没事 有的页面就不行 一点击就失焦 尚不知道什么原因会触发

@eiinu
Copy link
Member

eiinu commented May 17, 2024

可以提供一个可复现的代码用于排查问题。有可能与 focus 属性的设置有关系

@eiinu eiinu removed the to be closed 未提供最小化可复现 demo 且长期无进展的 issue label May 17, 2024
@zhangminggeek
Copy link
Contributor

可以提供一个可复现的代码用于排查问题。有可能与 focus 属性的设置有关系

没有设置 focus,就是正常在 Form 里使用

@oasis-cloud oasis-cloud self-assigned this Jun 6, 2024
@oasis-cloud
Copy link
Collaborator

oasis-cloud commented Jul 3, 2024

可以将 taro 版本指定为 3.6.22,看看问题是否出现。

根据提供的 Demo,在指定版本中并未复现出无法输入的问题。

@oasis-cloud oasis-cloud added the to be closed 未提供最小化可复现 demo 且长期无进展的 issue label Jul 3, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Need Reproduce to be closed 未提供最小化可复现 demo 且长期无进展的 issue
Projects
None yet
Development

No branches or pull requests

5 participants