简体   繁体   中英

Ant design Form "Warning: `callback` is deprecated. Please return a promise instead." Error in custom rules

I made custom rule on form elements. But when i use custom error message with promise its giving that error. What should i do for fix it ? My Form elements :

That rule is checking PriceMax and PriceMin. And validate if PriceMax is bigger than PriceMin. If Its not it should show me error message.So i used Promise but it making warning in console like : "Warning: callback is deprecated. Please return a promise instead." Error in custom rules"

 <Form.Item name="PriceMin" label="Minimum fiyat" required>
                  <Input
                    type="number"
                    name="Input"
                    placeholder="En düşük fiyat"
                    onChange={(e) => updateForm(e.target.value, "PriceMin")}
                  />
                </Form.Item>
                <Form.Item
                  name="PriceMax"
                  label="Maximum fiyat"
                  dependencies={["PriceMin"]}
                  rules={[
                    {
                      required: true,
                      message: "Please confirm your password!",
                    },
                    ({ getFieldValue }) => ({
                      validator(rule, value) {
                        if (
                          parseInt(value) < parseInt(getFieldValue("PriceMin"))
                        ) {
                          return Promise.reject(
                            "Maksimum fiyat minimum fiyattan az olamaz!"  //When i delete that row its fix warning, but i need have that error message.
                          );
                        }
                      },
                    }),
                  ]}
                >
                  <Input
                    name="Input"
                    type="number"
                    disabled={
                      MyForm.getFieldValue("PriceMin") === undefined ||
                      MyForm.getFieldValue("PriceMin") === ""
                        ? true
                        : false
                    }
                    placeholder="En yüksek fiyat"
                    onChange={(e) => updateForm(e.target.value, "PriceMax")}
                  />
                </Form.Item>

You must do as shown in the example
https://ant.design/components/form/#components-form-demo-register
The validator should always return a promise on both success and error

({ getFieldValue }) => ({
    validator(rule, value) {
        if (parseInt(value, 10) < parseInt(getFieldValue("PriceMin"), 10)) {
            return Promise.reject(
                  "Maksimum fiyat minimum fiyattan az olamaz!");
        }
        return Promise.resolve();
    }
})

Also you missed a radix parameter in the parseInt

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM