我建议在这里进行条件渲染，lista首先检查属性，然后再映射所有数据。

{
          this.props.lista && this.props.lista.map(function(data){
            return (  
              <tr key={data.codMat}>
                <td>{data.codMat}</td>
                <td>{data.material}</td>
                <td>{data.qntMin}</td>
              </tr>
              );
            })
            }

以及你有一个错误

this.setState( {data: resData.results});

因为您需要为 设置状态lista:resData.results，而不是data

您的代码有几个问题。尝试修复这些：

 constructor(props) {  //fixed
    super(props);  //fixed
    this.state = {
      lista: []
    };
  }

  componentDidMount() {
    fetch(
      'http://lospraianos-env-1.qu3skpxsmw.sa-east-1.elasticbeanstalk.com/api/materials'
    )
      .then(response => response.json())
      .then(resData => {
        this.setState({ lista: resData.results });   //fixed
      });
  }

和...

  {
    this.state.lista.length > 0 && this.state.lista.map(function(data) {   //fixed
      return (
        <tr key={data.codMat}>
          <td>{data.codMat}</td>
          <td>{data.material}</td>
          <td>{data.qntMin}</td>
        </tr>
      );
    })
  }

您正在设置对代码中不存在的状态变量数据的响应。您需要将其设置为 lista 而不是 fetch Api 调用中的数据，例如

    this.setState({lista : resData.results});

在这里做条件检查并做 .map

.map 没有返回

  <tbody>{
      this.props.lista && this.props.lista.map(data => (
          <tr key={data.codMat}>
            <td>{data.codMat}</td>
            <td>{data.material}</td>
            <td>{data.qntMin}</td>
          </tr>
        ))
        }
    </tbody>

.map 带返回

  <tbody>{
      this.props.lista && this.props.lista.map(data => {
          return (<tr key={data.codMat}>
            <td>{data.codMat}</td>
            <td>{data.material}</td>
            <td>{data.qntMin}</td>
          </tr>)
        })
        }
    </tbody>

你正在设置这个。state.lista 包含数组数据。

您正在尝试对此进行映射。props.lista。

this.state !== this.props。

更改this.props.lista.map为this.state.lista.map它应该可以工作。