final-form / final-form/react-final-form

useFieldState() does not update state properly when used with react-admin and material-ui select

Open
#853 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
7.4k
Forks
497
PR merge metrics
No merged PRs in 30d

Description

**bug report**

### What is the current behavior?

`useFieldState()` does not trigger when tracked select field changes from selected item 1 to selected item 2. Works only when you change it from or to first item (0)

```
export default function ItemInput() {
const form = useForm("itemType");

return (
form.change("attachmentsIds", undefined)}
filter={{ type: form.getFieldState("itemType")?.value }}
>


);
}
```

### What is the expected behavior?

I expected it to change `filter` every time when field called `itemType` changes it's state. `itemType` is a react-admin `SelectField` component, which is just material-ui `Select` with some data fetching and `react-final-form` to connect it to the form.

### What's your environment?

"@material-ui/core": "^4.11.0",
"ra-data-graphql-simple": "^3.8.0",
"react": "^16.13.1",
"react-admin": "^3.7.2",
"react-dom": "^16.13.1",
"react-final-form": "^6.5.1",

### Other information

Component works perfectly well when changed to:
```
export default function ItemInput() {
const form = useForm();
const field = useField("itemType");

console.log(field.input?.value);

return (
form.change("attachmentsIds", undefined)}
filter={{ type: field.input?.value }}
>


);
}
```

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.