反应不渲染迭代元素

Question

试图了解为什么我的循环在迭代后没有呈现

const ipRangeForm =
  <ul style={{listStyleType: 'none'}}>
    {
      ipData.map((value, index) => {
        return (
          <li style={{marginBottom: '25px', paddingBottom: '15px'}}>
            <Col span="8">
              <FormItem>
                {getFieldDecorator('start[' + index + ']', {
                  initialValue: value.start,
                  rules: [
                    {required: true, message: 'Start IP cannot be empty'}]
                })(
                  <Input placeholder="Start IP" />
                )}
              </FormItem>
            </Col>
            <Col span="1" style={{marginLeft: '15px'}}> - </Col>
            <Col span="8">
              <FormItem>
                {getFieldDecorator('end[' + index + ']', {
                  initialValue: value.end,
                  rules: [
                    {required: true, message: 'End IP cannot be empty'}]
                })(
                  <Input placeholder="End IP" />
                )}
              </FormItem>
            </Col>
            <Col span="4"> <a onClick={() => this.removeFromList(value)}><Icon type="delete" style={{
              marginLeft: 12,
              paddingTop: 12,
              color: "#FF0000"
            }} /></a></Col>
          </li>
        )
      })
    }
  </ul>

我有来自道具的ipData，发生的是，在第一次显示时它不会渲染该元素，但是在第一次加载它之后，它会显示正确的元素（重复）。我想知道为什么在完成迭代后不呈现我的视图？还是我做错了什么？

谢谢