🐛[BUG] EditableProTable currency symbol does not change on Money Field.

[xXAvoraXx]

Hello, I have created money field in EditableProTable, but there is a problem. Not every country has a currency symbol based on its location information, so I set up a library that contains currency symbols for all countries. I want to show this symbol according to the user's country, but the customssymbol property is not working.

   {
      title: 'Unit Price',
      dataIndex: 'unitPrice',
      valueType: 'money',
      fieldProps: {
        min: 0,
        max: 200000,
        locale: "en-GB" // ---> NOT WORK
        customSymbol: "GB" // ---->> NOT WORK
      },
      formItemProps: (form, { rowIndex }) => {
        return {
          rules: [{ required: true }],
        };
      },
    },

[github-actions[bot]]

以下的 Issues 可能会帮助到你 / The following issues may help you

• [#4576][🐛[BUG] EditableProTable currency symbol does not change on Money Field.][100%]

[Dunqing]

customSymbol and locale are at the root level

use like this

   {
      title: 'Unit Price',
      dataIndex: 'unitPrice',
      valueType: 'money',
      customSymbol: "GB",
      locale: "en-GB",
      fieldProps: {
        min: 0,
        max: 200000,
      },
      formItemProps: (form, { rowIndex }) => {
        return {
          rules: [{ required: true }],
        };
      },
    },

[xXAvoraXx]

customSymbol and locale are at the root level

use like this

   {
      title: 'Unit Price',
      dataIndex: 'unitPrice',
      valueType: 'money',
      customSymbol: "GB",
      locale: "en-GB",
      fieldProps: {
        min: 0,
        max: 200000,
      },
      formItemProps: (form, { rowIndex }) => {
        return {
          rules: [{ required: true }],
        };
      },
    },

Not Work

[chenshuai2144]

 {
      title: 'Unit Price',
      dataIndex: 'unitPrice',
      valueType: 'money',
      fieldProps: {
        min: 0,
        max: 200000,
        customSymbol: "GB",
        locale: "en-GB",
      },
      formItemProps: (form, { rowIndex }) => {
        return {
          rules: [{ required: true }],
        };
      },
    },

[xXAvoraXx]

 {
      title: 'Unit Price',
      dataIndex: 'unitPrice',
      valueType: 'money',
      fieldProps: {
        min: 0,
        max: 200000,
        customSymbol: "GB",
        locale: "en-GB",
      },
      formItemProps: (form, { rowIndex }) => {
        return {
          rules: [{ required: true }],
        };
      },
    },

Not Working

React does not recognize the customSymbol prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase customsymbol instead. If you accidentally passed it from a parent component, remove it from the DOM element.

[xXAvoraXx]

Yesterday I turned off my computer after I wrote this problem here, today I was going to open the project and try the change you made after seeing that this problem has been fixed, but I encountered this error. The console screen was not printing such an error yesterday.

Digit fields appear to be corrupted.

To test if the problem is with me, I opened a new project and moved all the code there, but the problem is not solved.

[xXAvoraXx]

Yesterday I turned off my computer after I wrote this problem here, today I was going to open the project and try the change you made after seeing that this problem has been fixed, but I encountered this error. The console screen was not printing such an error yesterday.

Digit fields appear to be corrupted.

To test if the problem is with me, I opened a new project and moved all the code there, but the problem is not solved.

I guess this error is related to the editable table component itself.

If we go back to our topic, customSymbol seems to be working, only react gives a typo. customSymbol works on the form field as desired, but still another currency unit comes in the table.

Warning: React does not recognize the `customSymbol` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `customsymbol` instead. If you accidentally passed it from a parent component, remove it from the DOM element

[chenshuai2144]

i add this code for next version

{...omit(fieldProps, [
          'numberFormatOptions',
          'precision',
          'numberPopoverRender',
          'customSymbol',
        ])}

[yogithesymbian]

why width field is not 100% ?