Tracking errors outside a form

[arturcarvalho]

Hi there,

How could I track errors outside of a Formkit form? Basically I want to show an error indicator outside of the form, but before the user presses submit. Normally I get this information on a composable that returns something like a meta or errors field.

Thanks and thanks for the library!

[fenilli]

You have access to those via the messages so you can get the node using getNode and do node.context?.message.

[arturcarvalho]

Thanks for the reply!

But how do I get that value reactively? I tried something like this below but it doesn't work. I basically want a ref with that info.

const form = getNode("some-id");

const messages = ref([]);
watch(
  () => form?.context?.messages,
  (msgs) => {messages.value = msgs}
);

Not sure what I'm missing, this might be my lack of experience with Vue.

[fenilli]

You can take a look at our FormKitMessage component where we make to change the placement of error messages.