alibaba / x-render

🚴‍♀️ 阿里 - 很易用的中后台「表单 / 表格 / 图表」解决方案
https://xrender.fun
6.98k stars 988 forks source link

在设置了自定义校验 validator 项的情况下,watch 第一次触发不生效,第二次才生效。 #1434

Closed JoelynZhou closed 10 months ago

JoelynZhou commented 10 months ago

1.依赖仓库的版本(Dependencies versions)image

2.问题描述(Bug description): watch 内设置了一组联动,当 select1 变化时,会触发 select2 数据更新。但当 schema 内有设置 validator 的项时,select1 第一次变化不会触发 select2 数据更新。 image

3.出现问题的 schema demo(Reproduction schema demo)

import React from "react";
import FormRender, { useForm } from "form-render";

const schema = {
  type: "object",
  displayType: "row",
  properties: {
    input: {
      title: "自定义校验",
      type: "string",
      rules: [
        {
          validator: (_, value) => {
            const pattern = "^[\u4E00-\u9FA5]+$";
            const result = new RegExp(pattern).test(value);
            return result;
            // 或者是返回一个对象,用于动态设置 message 内容
            // return {
            //   status: result,
            //   message: '请输入中文!',
            // }
          },
          message: "请输入中文!"
        }
      ]
    },
    select1: {
      title: "Select1",
      type: "string",
      widget: "select",
      props: {
        options: [{ label: "1", value: "1" }]
      }
    },
    select2: {
      title: "Select2",
      type: "string",
      widget: "select"
    }
  }
};

export default () => {
  const form = useForm();

  const watch = {
    select1: () => {
      form.setSchemaByPath("select2", {
        props: {
          options: [{ label: "2", value: "2" }]
        }
      });
    }
  };

  return <FormRender schema={schema} form={form} footer={true} watch={watch} />;
};

4.最小复现 demo(Reproduction demo)https://codesandbox.io/s/magical-villani-r8dd5j?file=/App.tsx:1199-1205

lhbxs commented 10 months ago

更新到最新版本,已修复