我想使用json文件而不是在下面使用静态数组,所以我可以自己更新数据。 cards数组用于DeckSwiper组件(参见:https://docs.nativebase.io/Components.html#deckswiper-def-headref)
const cards = [
{
text: 'text1',
name: '1',
image: {
uri: 'http://www.xxx.xx/2.jpg'
}
},
{
text: 'text2',
name: '2',
image: {
uri: 'http://www.xxx.xx/2.jpg'
}
},];
我想要获取的json看起来像这样。
{
"text1": "text1",
"name1": "1",
"image1": {
"uri1": "http://www.xxx.xx/1.jpg"
},
"text2": "text2",
"name2": "2",
"image2": {
"uri2": "http://www.xxx.xx/2.jpg"
}
}
所以我想使用'fetch'来获取json文件。 首先在构造函数中启动数组,如下所示。
constructor() {
super();
this.state = {
active: 'true',
response: [{text: '', name: '', image: {uri: ''}}],
}
}
然后我在componentDidMount()中使用'fetch',就像这样。
componentDidMount() {
fetch("http://www.xxx.xx/test.json", { method: 'get' })
.then((response) => response.json())
.then((responseJson) => {
this.setState({ response: responseJson });
});
}
如何将json转换为数组?因为在下面的代码中,dataSource需要一个数组而不是一个对象。
render() {
return(
...
<DeckSwiper dataSource={this.state.response}
...
/>
);
}