传递数组数据以反应本机视图

Question

我有一个函数可以从后端获取数据并映射数据，然后将它们添加到数组叫做 events_data

function getvals() {

    return fetch('http://**********/users/timetable')
        .then((response) => response.json())
        .then((output) => {
            addData(output, events_data);
        })


        .catch(error => console.log(error))

}

function addData(data, data2) {
    data.map((d) => {
        data2.push({
            title: d.name,
            startTime: genTimeBlock(d.day, d.start_time),
            endTime: genTimeBlock(d.day, d.end_time),
            location: d.location,
            extra_descriptions: [d.extra_descriptions],
        });
    });
}

所以在我的应用程序视图中，我想将 events_data 传递给 events 道具：

 <SafeAreaView style={{ flex: 1, padding: 30 }}>
     <View style={styles.container}>
       <TimeTableView
           scrollViewRef={this.scrollViewRef}
           events={// events.data will be passed here as array format //}**
           pivotTime={8}
           pivotDate={this.pivotDate}
           numberOfDays={this.numOfDays}
           onEventPress={}
           headerStyle={styles.headerStyle}
           formatDateHeader="dddd"
           locale="en"
          />
      </View>
      </SafeAreaView>

旁注： 时间表视图是第三方包，它接受传入 porp events={} 的数组并以时间表格式显示其数据所以在这里我想传递来自 function addData 的 events_data 数组并将其传递给 <TimeTableView>

中的 events prop

Answer 1

function getvals() {

    return fetch('http://**********/users/timetable')
        .then((response) => response.json())
        .then((output) => {
            return addData(output, events_data); //<-- add a return statement.
        })


        .catch(error => console.log(error))

}

在您调用 get Val 函数的 class 组件中。

const data = getvals();
this.setState({ events: data });

然后您可以在 table 中使用 this.state.events。

传递数组数据以反应本机视图

Pass data of array to react native view

arrays

json

react-native

fetch-api