javascript - 为什么自动对焦在antd的ReactJS中不起作用？

我在使用autoFocus时遇到了麻烦，我进行了很多搜索，但没有找到适合我的解决方案，我使用的是内部带有窗体的Drawer，该窗体具有一些带有Input的Form.Item，并且当我打开抽屉，我想关注form.item，有人可以帮助我吗？

这是我的代码：

<Drawer>
  <Form layout="vertical" ref={this.formRef} onFinish={this.onFinish} onFinishFailed={this.onFinishFailed}>
    <Row gutter={16}>
      <Col span={24}>
        <Form.Item
          name="description"
          label="Description"
          rules={[
            {
              required: true,
              message: 'Please enter a description.',
            },
          ]}
        >
          <Input.TextArea autoFocus rows={10} placeholder="Please enter a description." />
        </Form.Item>
      </Col>
    </Row>
    <Row style={{ bottom: '0', position: 'absolute', right: '38px' }}>
      <Form.Item>
        <Button
          onClick={this.onClose}
          style={{ marginRight: 8 }}
        >
          Cancel
      </Button>
      </Form.Item>
      <Form.Item>
        <Button type="primary" htmlType="submit">
          Submit
        </Button>
      </Form.Item>
    </Row>
  </Form>
</Drawer>

最佳答案

根据docs，不支持autoFocus prop（就像在<input />元素上一样）。以前没有使用过此ui库，因此无法说出使用ref手动设置焦点是否可行。

更新：

刚刚玩了一下，看起来可以手动设置焦点了：


demo
code


另一个更新：


demo with drawer
code

关于javascript - 为什么自动对焦在antd的ReactJS中不起作用？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/60877390/