将antd的input变为类似text

我使用了表单 Form - Ant Design这个组件，但是里面的input不想让用户编辑，所以就要将其转为text，如果直接将input改为text元素，来自接口的数据无法回显，解决方法是

<Input variant="borderless" readOnly={true}></Input>

  {fields.map((field) => (
              <Card
                size="small"
                title={`规格 ${field.name + 1}`}
                key={field.key}
              >
                <Form.Item
                  label=""
                  name={[field.name, "name"]}
                  rules={[{ required: true }]}
                >
                  <Input variant="borderless" readOnly={true}></Input>
                </Form.Item>

                {/* Nest Form.List */}
                <Form.Item label="规格名称" rules={[{ required: true }]}>
                  <Form.List name={[field.name, "values"]}>
                    {(subFields, subOpt) => (
                      <div
                        style={{
                          display: "flex",
                          flexDirection: "column",
                          rowGap: 16,
                        }}
                      >
                        {subFields.map((subField) => (
                          <Space key={subField.key}>
                            <Form.Item noStyle name={[subField.name, "value"]}>
                              <Input  variant="borderless" readOnly={true} />
                            </Form.Item>
                          </Space>
                        ))} 
                      </div>
                    )}
                  </Form.List>
                </Form.Item>
              </Card>
            ))}

参考 输入框 Input - Ant Design 再加上

DOM Elements – React (reactjs.org)