Question

这是我的App.js文件。我正在尝试使用fetch（）获取数据我想念什么？将错误作为TypeError：无法读取属性未定义的地图”。怎么了？如何得到结果？
我正在关注reactjs教程，但一直遇到问题将值从一个组件的状态传递到另一个组件时零件。抛出错误“无法读取未定义的属性'map'” 当执行CommentList组件中的map函数时。什么会导致道具在获取数据时变得不确定？我也尝试放置调试器，为什么它不在fetch调用中？

{isDropDownShown && (
              <SelectWithMargin
              instanceId="storeFilter"
              Value={{ label: 'Current', value: true }}
              onChange={this.handleChange}
              options={options}
              placeholder="Store"
            />
            )}

这是我的UsingFetch.js文件

import React, { Component } from 'react';
import UsingFetch from './UsingFetch'; 

class App extends Component {
  constructor(props){
    super(props);
    this.state = {
      companyList:[]
    };
  }

  componentDidMount(){
    fetch('https://jsonplaceholder.typicode.com/users')
      .then(res => { res.json() })
      .then(
        res => {
          this.setState({
            companyList : res
          });
        },
        (error) => {
          this.setState({
            isLoaded: true,
            error
          });
        }
      )
  }

  render() {
    return (
      <div className="App">
        1) DataGrid
        <UsingFetch datasource = {this.state.companyList}/>
      </div>
    );
  }
}

export default App;

这是我的App.js和UsingFetch.js文件。我正在尝试获取数据使用fetch（），我缺少什么？错误提示为：

TypeError：无法读取未定义的属性映射”

怎么了？我如何得到结果？

Answer 1

由于您没有从第一个if ($this->session->userdata('LoggedIn') == TRUE) { redirect('dashboard'); }块返回任何内容。因此，第二个then块中的res是then。您应该在

中使用undefined

return

更改为

then(res => { res.json() })

或

then(res => res.json())

Answer 2

您不在组件的任何地方使用isLoaded吗？您也没有传递任何东西。您应该传递状态，然后在setState中分配它。

在您的应用中：

<UsingFetch datasource = {this.state.companyList} isLoaded={this.state.isLoaded}/>

在您的UsingFetch

中

constructor(){
  super();

   this.state = {
      isLoaded:this.props.isLoaded,
 }
   }

或者只是检查数据源是否存在或已加载。

<div>
{this.props.datasource && this.props.isLoaded?
<React.Fragment>
                     {this.props.datasource.map(item =>
                     <div>
                         {item.name}
                     </div>
                     )}
 </React.Fragment>
:
<React.Fragment></React.Fragment>

无法读取未定义的属性“ map”，为什么？

2 个答案: