android – 在React Native中从Web服务填充ListView

概述我有这段反应原生代码： import React, { Component } from 'react';import { AppRegistry, StyleSheet, ToolbarAndroid, ListView, Text, View} from 'react-native';let styles = require('./styles/styles') 我有这段反应原生代码：

import React,{ Component } from 'react';import {  AppRegistry,StyleSheet,ToolbarandroID,ListVIEw,Text,VIEw} from 'react-native';let styles = require('./styles/styles');class Sunshine extends Component {  constructor(props) {    super(props);      this.state = {isLoading: true,JsonData: ''}  }  componentDIDMount() {    this.setState({JsonData: this.getMovIEsFromAPIAsync()})  }  render() {    if(this.state.isLoading != true) {      return (        <VIEw style={styles.container}>        <ToolbarandroID        style={styles.basetoolbar}        logo={require('./ic_launcher.png')}        title="Sunshine"        TitleTextcolor="red"/>        <VIEw style={styles.vIEwcontainer}>        <Text>{this.state.JsonData.city.ID}</Text>        <ListVIEw          dataSource={this.state.JsonData.List}          renderRow={(rowData) => <Text>{rowData.dt}</Text>}        />        </VIEw>        </VIEw>      );    } else {      return (        <VIEw style={styles.container}>        <ToolbarandroID        style={styles.basetoolbar}        logo={require('./ic_launcher.png')}        title="Sunshine"        TitleTextcolor="red"/>        <VIEw style={styles.singlevIEwcontainer}>        <Text>Loading...</Text>        </VIEw>        </VIEw>      );    }  }  getMovIEsFromAPIAsync() {      return fetch('http://API.openweathermap.org/data/2.5/forecast/daily?q=94043&mode=Json&units=metric&cnt=14&APPID=18dcba27e5bca83fe4ec6b8fbeed7827')        .then((response) => response.Json())        .then((responseJson) => {          this.setState({isLoading: false,JsonData: responseJson});          console.log(responseJson);          return responseJson;        })        .catch((error) => {          console.error(error);        });    }}AppRegistry.registerComponent('Sunshine',() => Sunshine);@H_502_12@  
我认为应该发生的是,当答案从服务器到达时,列表中会填充结果.但这不是正在发生的事情. Intsead我收到此错误：
  
  
undefined is not an object (evaluating 'allRowIDs.length')@H_502_12@  
那么我到底做错了什么呢？
解决方法 您必须使用数据列表创建ListVIEwDataSource.  
  
  
constructor (props) {  super(props)  this.dataSource = new ListVIEw.DataSource({    rowHasChanged: (r1,r2) => r1 !== r2  })}componentDIDMount () {  // You don't need to assign the return value to the state  this.getMovIEsFromAPIAsync()}render () {  // Use the dataSource  const rows = this.dataSource.cloneWithRows(this.state.JsonData.List || [])  ...  return (    ...    <ListVIEw      dataSource={rows}    />  )}@H_502_12@  
完整文档here.
                            	          总结       
以上是内存溢出为你收集整理的android – 在React Native中从Web服务填充ListView全部内容，希望文章能够帮你解决android – 在React Native中从Web服务填充ListView所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。
					
										


					

						
欢迎分享，转载请注明来源：内存溢出
原文地址: http://outofmemory.cn/web/1122520.html