3lang3 / react-vant

React mobile UI Components base on Vant

Home Page:https://react-vant.3lang.dev

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

🐛 [Bug]: 函数式调用Dialog.confirm如何触发关闭?

anyone-yuren opened this issue · comments

Which React Vant packages are impacted?

  • react-vant (React Vant core)
  • react-vant-icons(React Vant Icon)

What version of React Vant are you using?

3.3

Reproduce live demo(codesandebox or stackblitz)?

No response

Descripition

Dialog.confirm({
                    footer: <></>,
                    closeable: true,
                    title: '提示',
                    message: (
                      <>
                        <Form
                          onFinish={async (values) => {
                            const sendData: {
                              invoiceLineId: string | undefined;
                              inventoryId: any;
                              containerId: any;
                              quantity: any;
                            }[] = [];
                            values.users.forEach(
                              (item: { id: string | number; containerId: any }) => {
                                const quantity = values.users[item.id]?.quantity;
                                sendData.push({
                                  invoiceLineId: id,
                                  inventoryId: item.id,
                                  containerId: item.containerId,
                                  quantity: quantity,
                                });
                              }
                            );
                            console.log(Dialog.onClose());
                            const res = await ConfirmAllocated(sendData);
                            debugger;

                            if (res) {
                              getSelectedList();
                              Toast.success('分配成功');
                            }
                          }}
                          footer={
                            <div style={{ margin: '16px 16px 0' }}>
                              <Button round nativeType="submit" type="warning" block>
                                提交
                              </Button>
                            </div>
                          }
                        >
                          <Cell.Group>
                            <Form.List name="users" initialValue={unSelectHasData}>
                              {() => (
                                <>
                                  {unSelectHasData.map((field, idx) => {
                                    return (
                                      <div className="form-list-item" key={field.id}>
                                        <h6>
                                          <Space block align="center" justify="between">
                                            <strong>物料名称:{field.materialName}</strong>
                                          </Space>
                                        </h6>
                                        <div className="form-list-item__control">
                                          <Form.Item
                                            label="分配数量"
                                            name={[field.id, 'quantity']}
                                            rules={[]}
                                          >
                                            <Input placeholder="" />
                                          </Form.Item>
                                        </div>
                                      </div>
                                    );
                                  })}
                                </>
                              )}
                            </Form.List>
                          </Cell.Group>
                        </Form>
                      </>
                    ),
                  });
              我想在表单提交后,关闭弹窗。

建议使用组建调用形式