Lightning Web Component passing the particular value and retrieving the data in other component

Question

Hi I have a requirement in which i am passing the data from parent to child component and need to fetch the particular data in the track property in child component.

Parent Component.

    @track info = [];

    Info.push({
      name:"Priya",
      Age:"12",
      School:"Asvidya",
      City:"Delhi"
      });

     <C-child info = {Info} ></child>

Child Component.
@track priyaAge;
 @track informationgirl = [];

    @api
    get info() {
        return this.informationgirl;
    }

    set info(value) {
       this.informationgirl = value.detail;
    }

As per req i just want to pick out the age of priya from the incoming data and store in the @track priyaAge in child component.

Answer 1

You can see an example in the playground

in the parent component :

<c-child info={info}></c-child>

@track info = {
      name:"Priya",
      Age:"12",
      School:"Asvidya",
      City:"Delhi"
      };

In the child component

   @track priyaAge;
    @track informationgirl = [];

    @api
    get info() {
        return this.informationgirl;
    }

    set info(value) {

        this.informationgirl = value.detail;
        this.priyaAge = value.Age
    }