undefined不是一个对象

时间:2017-12-02 08:50:59

标签: json react-native

render(){

    let articles =this.props.data.map(function(articleData,index) {
      return (
        <Card>
        <CardItem>
          <Body>
            <Text>
            {articleData.address.city}
            </Text>
          </Body>
        </CardItem>
      </Card>

      )
    });
    return (
        <Content>
          {articles}
         </Content>
     );
  }

**[appBody:][1]**

getData(){
    return fetch("https://jsonplaceholder.typicode.com/users")
    .then((response) => response.json())
    .then((responseJson) => {
    this.setState({data:responseJson.array});
    })
    .catch((error) => {
      console.error(error);
    });


  }
  componentDidMount(){
    this.getData();
  }
  render() {
    return (
        <AppBodyData data={this.state.data}/>
     );

appBodyData

            if (a > 0)
        {
            double roundedUp = (a - Math.Floor(a)) > 0.5 ? Math.Ceiling(a) : Math.Floor(a);

        }
        else
        {
            double roundUp = Math.Abs(a - Math.Ceiling(a)) > 0.5 ? Math.Floor(a) : Math.Ceiling(a);

        }

}

当我尝试在模拟器中运行时,会显示此错误。    我该如何解决这个错误。    看来map函数无法获取数据。 反应原生cli版本:50 sdk版本:23

2 个答案:

答案 0 :(得分:0)

由于您的提取是异步的,因此在第一次渲染时this.props.data未定义。

此外,您需要使用this.state.data,因为获取的结果是设置状态而不是道具

首先在构造函数中设置初始状态:

constructor(props) {
    super(props);
    this.state = {
      data: []
    }
  }

然后更改为州

let articles =this.state.data.map(function(articleData,index) {

答案 1 :(得分:0)

由于获取方法,您获取空值需要时间来获取数据,因此在条件

时呈现
render(){
    return (
      <Content>
        {this.props.data?this.props.data.map((articleData,index)=>{
          return <Card>
            <CardItem>
              <Body>
                <Text>
                {articleData.address.city}
                </Text>
              </Body>
            </CardItem>
          </Card>          
          }):null}     
       </Content>
     );
  }