Question

所以我使用API来获取一个对象数组，每个对象都有很多数据，我想过滤这些数据只是为了获取我需要的数据，这样我就可以在React-Table上显示它。

＆＃13;

export default class Table extends React.Component {
  constructor(props){
    super(props);
    this.state = {
    }
  }

  fetchData() {
  const string = 'http://localhost:8000/issues/assigned/mike';
  fetch(string)
  .then(function(response) {
    return response.json();
  })
  .then((myJson) => this.setState(myJson));
  console.log(this.state)
}

  componentDidMount(){
    this.fetchData();
  }

  componentDidUpdate(prevProps) {
    if (prevProps.value !== this.props.value) {
        this.fetchData()
    }
  }

render() {
    return this.state.issues? (
      <div>
        <ResponseTable data={this.state.issues} />
      </div>
    ) : (
      <div>
         Loading ...
      </div>
    );
  }
}

＆＃13;

我从API接收的JSON文件： JSON DATA NEST

对于这个例子，只有一个对象，我接收到具有完全相同嵌套的50个对象，我正在寻找提取一些属性的东西（例如，data.issues [0] .fields .timespent）soo我可以将这些数据传递到我的react-table中并为每个＆＃34;问题创建一行＆＃34;

Answer 1

您尝试在更新之前记录状态，setState函数并不总是立即更新组件，但您可以使用回调函数setState(updater[, callback])在更新后立即获取状态。

关于数据过滤，您可以使用.map()或.filter()函数在响应转换为JSON后转换或过滤您的集合。

Answer 2

您可以使用.filter()方法过滤所需的数据，并使用.map()方法将此数据映射到适当的模型。

ReactJS过滤API数据

2 个答案: