LWC - Passing Data to a Child Component
Brett M. Nelson - Wednesday, August 28, 2019
Hello, I'm Brett with WIPDeveloper.com. Last time, we added a child component to a custom lightning web component. This time, let's try passing some information to the child component.
This is going to look very similar to using the lightning web components that are provided by Salesforce because the syntax is virtually the same from the parents point of view, the child on the other hand, we have to prepare a little bit.
ourProperty. Now we get so we can bind data to it from the parent, we have to use the API decorator. And for the API decorator, we have to import them from the LWC. So we're importing it online five and using it to decorate
ourProperty. Now we save that there shouldn't be any mission be any differences on our church, because page because we didn't use any change in any market.
So let's add that to our markup, refresh it, there should be just a dash, because we're not actually setting our property.
Now, let's add in our parent component on the upper right hand corner or side of the screen, we're going to duplicate the child component and we're going to add
our-property, we will assign a value to it.
Save that, and we should get two components over here, one that says child dash out from parent and when it says child dash now.
Now set the default is from child and we can refresh the page. And we should have two components child from parent child from child and that is how we pass data from our parent component to our child component and how to set the property as a default value.
That’s it for now.
Remember to sign up for The Weekly Stand-Up! and you can get updated with any new information we have on WIPDeveloper.com.