无法将数据从api呈现到表中

Question

Api url：https://dev.dashmed.in/sample-data用于获取api并在表中呈现的代码：

import React, { Component } from 'react'
import axios from 'axios'

export default class javascriptMap extends Component {
    constructor(props){
        super(props)
        this.state = {
          data: []
        }
      }
    
      getData(){
        axios.get('https://dev.dashmed.in/sample-data').then(res => {
          var data = res.data
            this.setState({data : data})
        })
      }
      componentDidMount(){
        this.getData()
      }
    render() {
        return (
            <>
             <ul>
        {this.state.data.map(d => (<li key={d.medName}>{d.saltName}</li>))} 
                </ul>
            </>
        )
    }
}

请指出错误发生在何处。

Answer 1

因为您的res.data包含{status: true, data: Array(5000)}。您需要将res.data.data设置为状态。

getData(){
    axios.get('https://dev.dashmed.in/sample-data').then(res => {
      const data = res.data.data
      this.setState({data : data})
    })
}