CODEWITHSUNDEEP
react-native
Billy Ronaldo Chandra
Billy Ronaldo Chandra

Reputation: 182

passing index to props in react native

I have trouble passing these index to my component, i'm trying to pass the icon and the description. What should i call in the props to grab all the items in index

this is my index.js 

    
    export const img =
{      
    itemStatus: {
        "Open": { name: 'open-book', type: 'entypo', color: '#ffb732', desc:'New Attribut, New Attention'},
        "Approved": { name: 'checklist', type: 'octicon', color: '#3CB371', desc:'Approved by SPV/MNG' },
        "Escalated": { name: 'mail-forward', type: 'font-awesome', color: '#ffb732', desc:'Escalated to SPV/MNG' },
        "Deliver Partial": { name: 'arrange-send-to-back', type: 'material-community', color: '#8B4513', desc:'Some items in a DO have not arrived/was faulty' },
        "Deliver": { name: 'truck-fast', type: 'material-community', color: '#8B4513', desc:'On delivery' },
        }

and my component

<IconModal visible={this.state.currentStatus !== null} close={this.handleDismissModal} status={this.state.currentStatus} 
                       desc={img.itemStatus.desc}
                       icon={}
                       
                       />

Upvotes: 0

Views: 87

Answers (1)

ravibagul91
ravibagul91

Reputation: 20765

You are using wrong key here desc={img.itemStatus.desc} in this line,

<IconModal visible={this.state.currentStatus !== null} close={this.handleDismissModal} status={this.state.currentStatus} desc={img.itemStatus.desc} icon={} />

If you want to access desc from your object you can do this,

desc = {Img.itemStatus.Open.desc}   // to get desc from Open item
Or
desc = {Img.itemStatus.Approved.desc} // to get desc from Approved item
Or
desc = {Img.itemStatus.Escalated.desc} // to get desc from Escalated item
Or
desc = {Img.itemStatus.Deliver.desc} // to get desc from Deliver item

Note: In your img object you have this,

'Deliver Partial': {
      name: 'arrange-send-to-back',
      type: 'material-community',
      color: '#8B4513',
      desc: 'Some items in a DO have not arrived/was faulty',
    }

Don't write object key as 'Deliver Partial' you won't be able to access it, just change it to,

Deliver_Partial: {
      name: 'arrange-send-to-back',
      type: 'material-community',
      color: '#8B4513',
      desc: 'Some items in a DO have not arrived/was faulty',
    }

Simplified demo to access desc from each key of img object

Upvotes: 1

Related Questions