使用键从回调函数返回值

Question

我在从包含JSON的对象中设置变量时遇到问题。返回的JSON如下所示

{
  "id": "6",
  "FName": "Chris",
  "LName": "Baker",
  "Height": "6'2",
  "Meds": [
    {
      "MedicationName": "acetaminophen",
      "Doseage": "Take 2 daily with food",
      "NumRefills": 2,
      "RefillExp": "2017-05-31T15:38:50.02Z",
      "FirstPrescribed": "2017-05-31T15:38:50.02Z",
      "WFID": "string"
    }
  ]
}

在我的React代码中，我基本上是在不同组件中使用JSON的不同部分。因此，我的App组件将状态传递给它各自的组件(Overview和Meds)。概述工作得很好，可能是因为我传递了整个状态，然后根据键能够获得根值(即FName，LName)。然而，我正在为如何处理Meds而苦苦挣扎。我正在尝试从状态向下传递JSON的药物部分，以便药物窗格可以只显示传递给它的内容。

  class App extends ReactComponent {
  ....
  render() {
    //what worked before was needing to set state to this.state.PATIENT[0].Meds
    //use  console.log{this.state.PATIENT} to see if things output properly
    return (
      <App>
        <Article>
          <Header>
            <Section>
              <Accordion openMulti={false} active='0'>
                <AccordionPanel heading='Overview'>
                  <Box colorIndex='light-2' full='horizontal' direction='row' flex={false}>
                    <OverviewPane overview={this.state.PATIENT}/>
                  </Box>
                </AccordionPanel>
                <AccordionPanel heading='Medications'>
                  <Box colorIndex='light-2' full='horizontal' direction='row' flex={false}>
                  **<MedicationsPane meds={this.state.PATIENT.map(function (P,)){return P.Meds})}/>**
                </AccordionPanel>
              </Accordion>
            </Section>
          </Header>
        </Article>
      </App>
    );
  }
}


class MedicationsPane extends React.Component {  

  constructor(props) {
    super(props);
    autoBind(this);
  }

  render () {
    return (
      <List>
            {this.props.meds.map(function(Meds) {
            return <ListItem justify='between' separator='horizontal' key={Meds.MedicationName}>{Meds.MedicationName}</ListItem>;
          })}
      </List>
    );
  }
}

我想我需要传入像P.id这样的键，才能返回Meds，但似乎不能传入索引。或者我需要使用Children.Map？在这一点上真的很困惑，任何帮助都将不胜感激。

Answer 1

json中的Meds是一个只有一个对象的数组，因此要访问Meds，可以像使用json.Meds一样使用它。像这样传递它：

<MedicationsPane meds={this.state.PATIENT.Meds[0]}/>