ReactJS：映射数据未显示在视图中

Question

我有一个函数previewData()，我用它来映射一个数据数组，如下所示（在渲染方法中）：

const {formData} = this.state;

function previewData() {

    formData.map((item, key) => {
        console.log("item", item.question);
        return (<div>{item.question}</div>)
    })
}

在渲染方法的return 语句中，我正在使用这样的函数：

<div className="form_preview polaroid unchange_div">
    {previewData()}
</div>

这就是我将数据推送到我的数组中的方式（在渲染方法之外）：

addFormData() {

    const {formQuestion} = this.props;

    const formRawData = {
      'question': formQuestion,
      'type': this.state.qtype
    }

    this.state.formData.push(formRawData);

    this.setState({
      success: true
    })
  }

我可以看到我的控制台也正确记录了日志，但我的视图中没有填充这些值。这里似乎有什么问题？

Answer 1

您需要确保 previewData() 返回映射的结果，以便映射的 <div> 元素数组可以在 polaroid 容器内呈现：

function previewData() {

     /* Add return before formData.map */
      return formData.map((item, key) => {
        console.log("item", item.question);
        return (
          <div>{item.question}</div>
        )
      })
    }