alibaba / x-render

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

表单项的id带有#时,表单没办法动态隐藏字段 #1455

Closed Yojay97 closed 3 days ago

Yojay97 commented 8 months ago

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

2.问题描述(Bug description): 我有一个表单项会根据另外一个表单项的值进行联动,来决定是否隐藏。我发现这个隐藏只在初始化表单的时候有作用,初始化完表单后,切换会影响到隐藏的表单项值时,就不起作用了。

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

const schema = {
  // ...
}

我是手机敲的,实在不好意思,省略一些东西 我的hidden是这样写的 “hidden”: “ {{formData[‘select#type’] !== ‘a’}} ” 我的那个下拉框因为业务需要,所以id是带#号的 4.最小复现 demo(Reproduction demo)

form-render demo https://codesandbox.io/s/unruffled-flower-jl78h table-render demo https://codesandbox.io/s/sweet-euler-bdoty fr-generator demo https://codesandbox.io/s/s13sh

Yojay97 commented 8 months ago

我补充一下我的测试代码

import FormRender, {useForm} from "form-render";
import ProCard from "@ant-design/pro-card";

const schema =  {
  type: 'object',
  properties: {
    input: {
      title: '输入框',
      type: 'string',
      widget: 'input',
      hidden: "{{ formData['select#type'] === 'a' }}"
    },
    select: {
      title: '下拉框',
      type: 'string',
      widget: 'select',
      props: {
        options: [
          { label: '早', value: 'a' },
          { label: '中', value: 'b' },
          { label: '晚', value: 'c' }
        ]
      }
    }
  }
};

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

  const onFinish = (formData) => {
    console.log('formData:', formData);
  };

  schema.properties['select#type'] = schema.properties.select;

  return (
    <ProCard>
      <FormRender
        form={form}
        schema={schema}
        onFinish={onFinish}
        maxWidth={360}
        footer={true}
        initialValues={{'select#type': 'b'}}
      />
    </ProCard>

  );
}
Yojay97 commented 8 months ago

动画

lhbxs commented 7 months ago

你们的 key 怎么这么奇怪,不按套路出牌啊。

lhbxs commented 3 days ago

'#' 号 和 xrender 的逻辑字段冲突了,你进行变更。