How to refresh a child component?

#1

How can I refresh a child component? I have a component that it’s a form with various values binded in some fields. User have two options: save or cancel. Imagine that user change fields values but decide to cancel this edition. When he clicks in Cancel, it should “erase” his editions and the data in these fields come back to the his original form.

I was thinking that the best option would be make a refresh of this specific component, binding old data again. But I’m not sure that this is the best option or how to do it. Someone can help giving a insight or a solution, please?

1 Like
#2

Simplest way is to keep a copy of the original data. When the user chooses to cancel, you just restore edited data to the copied value.

Regards.

2 Likes
#3

Thanks. It’s a option, but we have a lot of data from different sources. So, we will have duplicated data for a big form. There is no way to get the original state of this binding var? Because when we do a entire refresh, data come back for his original form.

But we have no other option, yeah, we need to go with that. Thanks!

1 Like
#4

That has been my go-to approach as well, not because it’s the best, just it’s the easiest to implement. I’d say just go with it to deal with the requirements and add some todo and do more research on this matter. Would’be interested in what you come up with later.

#5

I don’t have time to propose a full solution right now, but I think a clever combination of custom binding behavior and singal should do the trick.

1 Like
#6

What would be helpful in order to propose a solution is to have a minimalistic repro of your case. There are a few things I could think of but it depends on how you bind to data, pass the data to the child etc. So take a short spin with Codesandbox and Im sure we’ll find something suiteable

1 Like