javascript - 如何在 React-Native collapsible/accordion 中使用外部源数据

Question

我在我的项目中使用了 react-native collapsible/accordion。我在下面找到了一个例子

import React, {` Component } from 'react-native';
import Accordion from 'react-native-collapsible/Accordion';

const SECTIONS = [
  {
    title: 'First',
    content: 'Lorem ipsum...',
  },
  {
    title: 'Second',
    content: 'Lorem ipsum...',
  }
];

class AccordionView extends Component {
  _renderHeader(section) {
    return (
      <View style={styles.header}>
        <Text style={styles.headerText}>{section.title}</Text>
      </View>
    );
  }

  _renderContent(section) {
    return (
      <View style={styles.content}>
        <Text>{section.content}</Text>
      </View>
    );
  }

  render() {
    return (
      <Accordion
        sections={SECTIONS}
        renderHeader={this._renderHeader}
        renderContent={this._renderContent}
      />
    );
  }
}

我已将我的数据存储在 state 中

state = { orders: [] };

  componentWillMount() {
    axios.get('https://jsonblob.com/api/jsonBlob/c6ccf4e2-3871-11e7-ae4c-bb26ea80a2f8')
      .then(response => this.setState({ orders: response.data }));
  }

所以我的问题是如何在上面的示例代码中使用我的数据 (orders) 而不是 SECTIONS。谢谢

Answer 1

在这里，只需将 SECTIONS 替换为 this.state.orders

    render() {
      return (
        <Accordion
          sections={this.state.orders}
          renderHeader={this._renderHeader}
          renderContent={this._renderContent}
        />
      );
    }