将 json 对象的值传递给另一个对象
pass values of json object in react native to another object
我使用提取 API 从后端服务器获取数据。我从 fetch 函数返回了 JSON 对象数据,我想将对象中的每个值传递给另一个对象。
function getvals() {
return fetch('http://*********/users/timetable')
.then(response => response.json())
.then((responseData) => {
console.log(responseData);
return responseData;
})
.catch(error => console.log(error))
}
函数getvals()
正在返回对象数据,这些数据如下所示:
[{"title": "Math","day": "FRI", "end_time": 11, "start_time": 9,location: "Classroom 403",extra_descriptions: "Chen"}]
现在我希望将对象数据的每个值都传递给此对象:
const events_data = [
{
title: "Math",
startTime: genTimeBlock("WED", 9),
endTime: genTimeBlock("WED", 10),
location: "Classroom 403",
extra_descriptions: ["Kim", "Lee"],
},
{
title: "Mandarin",
startTime: genTimeBlock("TUE", 9),
endTime: genTimeBlock("TUE", 10),
location: "Language Center",
extra_descriptions: ["Chen"],
},
{
title: "Japanese",
startTime: genTimeBlock("FRI", 9),
endTime: genTimeBlock("FRI", 10),
location: "Language Center",
extra_descriptions: ["Nakamura"],
},
];
例如 getvals()
函数中的日期值,我想将其传递到 startTime
中 events_data
对象
中
然后在视图中 events_data
将传递给 events props
:
<SafeAreaView style={{ flex: 1, padding: 30 }}>
<View style={styles.container}>
<TimeTableView
scrollViewRef={this.scrollViewRef}
**events={// events.data will be passed here as object format //}**
pivotTime={8}
pivotDate={this.pivotDate}
numberOfDays={this.numOfDays}
onEventPress={getvals}
headerStyle={styles.headerStyle}
formatDateHeader="dddd"
locale="en"
/>
</View>
</SafeAreaView>
这可能很简单,但我是这个方法的新手,我找不到简单的方法来做到这一点。
您可以映射数据,然后将它们添加到数组 events_data
。
函数 addData
将从提取请求中接收到的数据以所需的格式推送到 events_data
。
function getvals() {
fetch("http://*********/users/timetable")
.then((response) => response.json())
.then((output) => {
addData(output, events_data);
})
.catch((error) => console.log(error));
}
function addData(data, data2) {
data.forEach(d) => {
data2.push({
title: d.title,
startTime: genTimeBlock(d.day, d.startTime),
endTime: genTimeBlock(d.day, d.endTime),
location: d.location,
extra_description: [d.extra_description],
});
});
}
编辑:
如果你想渲染数据,那么你可以这样做:
const RenderData = () => {
return (
<View>
{events_data &&
events_data.result.map((data) => {
return <Text>{data.title}</Text>;
})}
</View>
);
};
我使用提取 API 从后端服务器获取数据。我从 fetch 函数返回了 JSON 对象数据,我想将对象中的每个值传递给另一个对象。
function getvals() {
return fetch('http://*********/users/timetable')
.then(response => response.json())
.then((responseData) => {
console.log(responseData);
return responseData;
})
.catch(error => console.log(error))
}
函数getvals()
正在返回对象数据,这些数据如下所示:
[{"title": "Math","day": "FRI", "end_time": 11, "start_time": 9,location: "Classroom 403",extra_descriptions: "Chen"}]
现在我希望将对象数据的每个值都传递给此对象:
const events_data = [
{
title: "Math",
startTime: genTimeBlock("WED", 9),
endTime: genTimeBlock("WED", 10),
location: "Classroom 403",
extra_descriptions: ["Kim", "Lee"],
},
{
title: "Mandarin",
startTime: genTimeBlock("TUE", 9),
endTime: genTimeBlock("TUE", 10),
location: "Language Center",
extra_descriptions: ["Chen"],
},
{
title: "Japanese",
startTime: genTimeBlock("FRI", 9),
endTime: genTimeBlock("FRI", 10),
location: "Language Center",
extra_descriptions: ["Nakamura"],
},
];
例如 getvals()
函数中的日期值,我想将其传递到 startTime
中 events_data
对象
然后在视图中 events_data
将传递给 events props
:
<SafeAreaView style={{ flex: 1, padding: 30 }}>
<View style={styles.container}>
<TimeTableView
scrollViewRef={this.scrollViewRef}
**events={// events.data will be passed here as object format //}**
pivotTime={8}
pivotDate={this.pivotDate}
numberOfDays={this.numOfDays}
onEventPress={getvals}
headerStyle={styles.headerStyle}
formatDateHeader="dddd"
locale="en"
/>
</View>
</SafeAreaView>
这可能很简单,但我是这个方法的新手,我找不到简单的方法来做到这一点。
您可以映射数据,然后将它们添加到数组 events_data
。
函数 addData
将从提取请求中接收到的数据以所需的格式推送到 events_data
。
function getvals() {
fetch("http://*********/users/timetable")
.then((response) => response.json())
.then((output) => {
addData(output, events_data);
})
.catch((error) => console.log(error));
}
function addData(data, data2) {
data.forEach(d) => {
data2.push({
title: d.title,
startTime: genTimeBlock(d.day, d.startTime),
endTime: genTimeBlock(d.day, d.endTime),
location: d.location,
extra_description: [d.extra_description],
});
});
}
编辑:
如果你想渲染数据,那么你可以这样做:
const RenderData = () => {
return (
<View>
{events_data &&
events_data.result.map((data) => {
return <Text>{data.title}</Text>;
})}
</View>
);
};