antd Upload放动态增减表单 onchange不起作用是什么原因

发布于 2022-09-12 13:55:16 字数 2370 浏览 16 评论 0

如标题 发现上传有去调用接口 但是没有调用onChange方法 代码如下

getFieldDecorator('keys', { initialValue: [0] });
          const keys = getFieldValue('keys');
          const formItems = keys.map((k, index) => (
            <Row key={k} gutter={24} style={{border: "1px dashed rgba(0,0,0,0.3)", alignItems: 'center', display: 'flex', flexDirection: 'row', marginBottom: 30}}>
              <Col span={6}>
                <Form.Item
                  key={k}
                  style={{margin: 0}}
                >
                  {getFieldDecorator(`pname[${k}]`, {
                    initialValue: pname[k],
                    rules: [{
                      required: true,
                      whitespace: true,
                      message: "请输入产品名称/标题",
                    }],
                  })(
                    <Input placeholder="产品名称/标题"/>
                  )}
                </Form.Item>
              </Col>
              <Col span={16}>
                <Form.Item style={{margin: 0, marginTop: 25}}>
                  {getFieldDecorator(`pres[${k}]`, {
                    initialValue: fileList && fileList[k] && fileList[k].length > 0 ?  fileList[k] : [],
                    rules: [{
                      required: true,
                      message: "请上传资料类型",
                    }],
                  })(
                    <Upload
                      key={"upload" + k}
                      action={upload}
                      fileList={fileList && fileList[k] && fileList[k].length > 0 ?  fileList[k] : []}
                      onChange={(e) => {this.handleChange(e,k)}}
                      listType="picture-card"
                    >
                      {uploadButton}
                    </Upload>
                  )}
                </Form.Item>
              </Col>
              <Col span={2}>
                  {keys.length > 1 ? (
                    <Icon
                      style={{ marginLeft: 8 }}
                      className="dynamic-delete-button"
                      type="minus-circle-o"
                      onClick={() => this.remove(k)}
                    />
                  ) : null}
              </Col>
            </Row>
          ));

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

浅黛梨妆こ 2022-09-19 13:55:16

Form.Item下的onChange是自动注入的 你要自定义的话就要把Upload再封一层

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文