flat-fuchsia

Update a field in multiple places

I need to be able to set a photoUrl field in 2 places - 1 to set the string (by uploading a file) and the other to clear the photo. Should I juse wrap both places in separate

            <Field name={`items[${index}].photoUrl`}>
              {(photoField) => (

              )}
            </Field>

            <Field name={`items[${index}].photoUrl`}>
              {(photoField) => (

              )}
            </Field>

wrappers? That's what I tried but if I try calling photoField.setValue(""); in the clear photo button, nothing happens.

6 Replies

flat-fuchsiaOP•13mo ago

ok what's actually happening is the form state is updating but the UI doesn't reflect it. is that some kind of performance optimization? how do i instruct tanstack <Field> wrappers to subscribe to the change

sensitive-blue•13mo ago

should be

<form.Subscribe selector={(state) => state.values.items} children={() => (<!-- the ui you want to update when "items" changed -->)} />

flat-fuchsiaOP•13mo ago

thanks! trying that ok yeah i'm needing to get used to how things work in tanstack form. there are places where state is exposed but it's not actually a realtime value so it can become stale unless you explicitly use Subscribe pretty cool but quite a bit different than working with regular useState values in react!

sensitive-blue•13mo ago

You can achieve reactivity in two ways, one is as mentioned with the form.Subscribe component, the other is with the useStore hook

const firstName = form.useStore((state) => state.values.firstName)

const firstName = form.useStore((state) => state.values.firstName)

sensitive-blue•13mo ago

Is there a way to exclude the "Bytes" results from the Search - that makes it hard to find something about it on the docs…

sensitive-blue•13mo ago

This thread is probably not the best place to ask that but I forwarded it to the other maintainers, thanks 🙂

Gaming

Programming

Update a field in multiple places

Did you find this page helpful?