将一个道具的值从一个函数传递给React.JS中的render（）

Question

我正在从我的React App向我的后端发出get请求。该调用是成功的，我能够从后端接收值。但是，我无法将该值设置为前端DOM。 这里是我目前类的样子：

class App extends React.Component{ 
    componentDidMount(){ 
     this.props.getData(); 
    } 
    renderProds(){ 
     const data = this.props.products; 
     if(data){ 
      data.map((e)=>{ 
       return (
        <Product 
         name={e.name} 
         desc={e.desc} 
        /> 
       ); 
      }); 
     } 
    } 
    render(){ 
     return(
      <div>{this.renderProds()}</div> 
     ) 
    } 
} 

我确信，我的产品成分导入正确，它是接受道具name和desc。

我在做什么错？

Answer 1

你应该从renderProds方法中返回一些东西。试试这个：

renderProds(){ 
     const data = this.props.products; 
     if(data){ 
      return data.map((e)=>{ // return computed value 
       return (
        <Product 
         name={e.name} 
         desc={e.desc} 
        /> 
       ); 
      }); 
     } 
    }