[BUG] Form decorators should not change from one render to the next as new values will be ignored

adamklepacz commented 4 years ago

Are you submitting a bug report or a feature request?

Please guys check the code down below in the sandbox. The same decorators but getting an error about decorators change. It is probably a bug. Cause when I console.log decorators they're always the same but I'm getting an error: Form decorators should not change from one render to the next as new values will be ignored

What is the current behavior?

Getting an error about decorators change. but they're the same. Check screenshot: Zrzut ekranu 2020-04-28 o 12 22 45

What is the expected behavior?

Should not throw an error if the decorators are the same.

Sandbox Link

https://codesandbox.io/s/naughty-panini-ycjd9?file=/src/App.js

What's your environment?

"react-final-form": "^3.6.3", "final-form": "^4.8.1", "final-form-arrays": "^1.0.4", "final-form-calculate": "^1.2.1",

Other information

BMCwebdev commented 4 years ago

You ever make any progress on this @adamklepacz ? Having same issue.

evgeny-t commented 4 years ago

You can either wrap createDecorator with useEffect or move it outside of the render.

const rentTypeDecorator = useMemo(() => createDecorator(
    {
      field: 'details.base_rent_and_operation',
      updates: {
        'details.fixed_rent': (baseRentAndOperationValue) => !baseRentAndOperationValue,
      },
    },
    {
      field: 'details.fixed_rent',
      updates: {
        'details.base_rent_and_operation': (fixedRentValue) => !fixedRentValue,
      },
    },
  ), [])

justinsgithub commented 2 years ago

Move the createDecorator function outside of the function component

` import this from this import that from that

const focusOnError = createDecorator()

export const App = () => { all my App code } `

final-form / react-final-form